关于CSS样式的书写规则
发布网友
发布时间：2022-05-03 12:25
共1个回答
热心网友
时间：2022-05-14 03:35
.menu ul li:hover a{……} 和 .menu ul li a:hover{........}虽然最终目标都是a标签，但是前者是a的父级li元素鼠标移上去时触发，后者是a元素本身鼠标移上去时触发。在a和li的大小是一样的时候两者的效果类似，但下面的就不一样了：
<style type="text/css">.menu ul{ list-style:none; margin:0; padding:0;}
.menu ul li a{ text-decoration:none; color: black; }
.menu ul li { height:50px; outline: dot 1px gray;}
.menu ul li:hover a { color: red }
.menu ul li a:hover { color: blue }
</style>
<div class="menu">
<ul>
<li><a href="#">文字内容</a></li>
</ul>
</div>
.menu ul li a, .menu ul li a:visited {……} 逗号分隔是同时应用的意思，a:visited是指访问过的a元素，是a元素的子集，所以整条可以用.menu ul li a{……}替代，但是不能用.menu ul li a:visited{……}替代
