首页 > 代码库 > 为什么选择器li#id名/li.类名的写法
为什么选择器li#id名/li.类名的写法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{
padding:0;
margin:0;
}
ul.uls{
float:left;
}
ul.uls li{
display:inline;
}
ul.uls li a{
border-left:1px solid red;
padding:10px;
text-decoration:none;
}
</style>
</head>
<body>
<ul class="uls">
<li class="info"><a href="http://www.mamicode.com/">a</a></li>
<li><a href="http://www.mamicode.com/">b</a></li>
<li><a href="http://www.mamicode.com/">c</a></li>
<li><a href="http://www.mamicode.com/">d</a></li>
<li><a href="http://www.mamicode.com/">e</a></li>
</ul>
</body>
</html>
那代码运行效果为：
而此时想将第一个<a>标签的边框去掉，如果设置 .info a 选择器：
.info a{
border:none;
}
运行之后会发现未起作用，第一个<a>标签的边框依然还在。
可以尝试下面写法：
ul.uls li.info a{
border:none;
}
结果：
我只知其然，不知其所以然，具体原因有朋友知道可以分享一下。
为什么选择器li#id名/li.类名的写法