ID选择器优先级高于类选择器，权重分别为1-0-0和0-1-0，组合选择器权重可叠加但无法超越ID，内联样式和!important优先级更高，需谨慎使用。
在CSS中，类选择器和ID选择器的优先级不同，这直接影响样式规则的应用顺序。当多个规则作用于同一个元素时，浏览器会根据选择器的优先级决定使用哪条规则。
ID选择器的优先级比类选择器高。这意味着如果一个元素同时匹配了ID选择器和类选择器的样式规则，ID选择器定义的样式会生效。
说明：例如：
#header { color: blue; } /* 优先级 1-0-0 */
.header { color: red; } /* 优先级 0-1-0 */
<p><div id="header" class="header">文字</div></p><p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p>最终文字颜色为蓝色，因为ID选择器优先级更高。
单一选择器之外，组合使用会叠加优先级。比如多个类或与标签结合时，权重相加。
即便如此，单个ID选择器仍高于任意数量的类选择器组合。
虽然ID选择器比类选择器优先级高，但仍有更高层级：
建议避免滥用 !important，以免后期维护困难。
基本上就这些。掌握优先级计算规则，能更准确控制页面样式表现。不复杂但容易忽略细节。
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
336
收藏
