<head>
<meta charset="UTF-8">
<title>pseudo selecotor</title>
<style>
.top-menu {
margin:50px auto;
padding:0;
list-style:none;
width:610px;
height:35px;
box-shadow:0 3px 4px #8b8b8b;
background-color:#dadada;
}
.top-menu li {
float:left;
border-right:1px solid #929292;
}
.top-menu li a:link{
color:black;
text-decoration:none;
text-align:center;
display:block;
width:100px;
height:35px;
line-height: 35px;
}
.top-menu li a:visited {
color:black;
}
ul li a:hover{
background-color: #555;
color: #fff;
}
</style>
</head>
<body>
<nav>
<ul class="top-menu">
<li><a href="#">menu1</a></li>
<li><a href="#">menu2</a></li>
<li><a href="#">menu3</a></li>
<li><a href="#">menu4</a></li>
<li><a href="#">menu5</a></li>
<li><a href="#">menu6</a></li>
</ul>
</nav>
</body>
我運行這個頁面,
如果將滑鼠懸停在選單上,則文本顏色為黑色。
但在 css 中,hover 的文本顏色是白色的。
如果我改變懸停的選擇器
從 ul -> 到 .top-menu
文本顏色為白色。
這是因為我將黑色作為類選擇器,將白色作為標簽選擇器嗎?
是因為在應用標簽之后應用了類嗎?
uj5u.com熱心網友回復:
這是因為類比元素和偽元素具有更高的特異性值。在您的情況下.top-menu,比 element 具有更高的特異性ul,因此遵循/使用其樣式。具體見下表:

更多關于這里的特異性。
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/422176.html
標籤:
上一篇:標簽標簽不可見
