1.属性名，属性名=属性值（正则）
= 是绝对等于
*= 是包含这个元素
^= 以这个开头
$= 以这个结尾
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>2021-11-23</title>
<style type="text/css">
.demo a{
float: left;
display: block;
height: 50px;
width: 50px;
border-radius: 10px;
background: #0000FF;
text-align: center;
color: #7CFC00;
text-decoration: none;
margin-right: 5px;
font: bold 20px/50px Arial;
}
/*
1.属性名，属性名=属性值（正则）
= 是绝对等于
*= 是包含这个元素
^= 以这个开头
$= 以这个结尾
*/
/*存在ID属性的元素把他选中 a[]{}
a[id=first]{
background: #FF0000;
}
a[id]{
background: #FF0000;
}
*/
/* class 中有links的元素
a[class*="links"]{
background: #FF0000;
} */
/* 选中href中以http开头的元素
a[href^=http]{
background: #000000;
} */
/*以html结尾*/
a[href$=html]{
background: #FFFFFF;
}
</style>
</head>
<body>
<p class="demo">
<a href="http://www.baidu.com" class="links item first" id="first">1</a>
<a href="#" class="links item active" target="_blank" title="test">2</a>
<a href="拼多多首页导航布局.html" class="links item ">3</a>
<a href="#" href="拼多多首页导航布局.html" class="links item ">4</a>
<a href="#" class="links item ">5</a>
<a href="#" class="links item ">6</a>
<a href="#" class="links item ">7</a>
<a href="#" class="links item ">8</a>
<a href="#" class="links item ">9</a>
<a href="#" class="links item ">10</a>
</p>
</body>
</html>
