CSS的优先级权重是指CSS选择器决定哪一个CSS规则被应用享有的权重。当多个CSS规则具有相同的属性,则会使用权重定义哪一个规则应用至元素。
权重从左到右接近,且左侧的规则权重优先于右侧的规则权重。例如,一个选择器包含一个ID和一个元素,其优先于仅包含一个元素和一个类的选择器。
以下是CSS选择器和其对应优先级权重的示例:
#my-id { /* 减少开销 */ font-size: 18px !important; } .my-class { /* 外观 */ color: red; } div { /* 标签选择器 */ font-size: 20px; }
在上面的示例中,选择器 "#my-id", ".my-class",和 "div" 具有不同的权重。" #my-id" 的权重是最高的,因为它包含一个ID选择器,它的权重为10,而其他两个选择器的权重分别为1和0。
此外,带有“!important”关键字的CSS属性会覆盖其他所有权重。这是因为“!important”关键字对应于一个非常高的权重,优先级比ID选择器还高。
在编写CSS时,请记住优先级和其对应的权重。以简单的方式来编写CSS,避免使用过多的CSS规则,特别是在网页中包含大量元素的情况下。