<分区>
html - 为什么悬停时整个导航 div 是洋红色而不是蓝色？
使用 id 或 class 来选择元素重要吗？整个导航 div 在悬停时应该是蓝色的，因为它是在洋红色之后应用的。
.navigation {
color: salmon;
height: 100px;
}
#navigation:hover {
color: magenta;
}
.navigation:hover {
color: blue;
}
.navigation li a {
text-decoration: none;
color: inherit;
} <div id="navigation" class="navigation">I am navigation text!
<ul>
<li><a href="home.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>最佳答案
请引用此资源:Calculating CSS Specificity Value
... Simply using the class name by itself had a lower specificity value and was trumped by the other selector which targeted the unordered list with the ID value. The important words in that sentence were class and ID. CSS applies vastly different specificity weights to classes and IDs. In fact, an ID has infinitely more specificity value! That is, no amount of classes alone can outweigh an ID.
总之，ID 比 Class 更具体，因此具有相同 CSS 属性的元素(例如 color)在ID 和 Class 将具有 ID 属性规范的值，而不是 Class 规范的值。
Inline 样式再次更加具体，并且将胜过 ID 样式。
来源:https://css-tricks.com/specifics-on-css-specificity/#article-header-id-0
关于html - 为什么悬停时整个导航 div 是洋红色而不是蓝色？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58635880/