[分享]css中4个0计算权重

CSS中的选择器权重是用来确定在应用样式时，哪些规则将优先应用的。CSS中的4个0计算法则是一种用于计算选择器权重的方法，它将选择器分成不同的等级并赋予不同的权重。选择器 权重值 id 100 .c...

CSS中的选择器权重是用来确定在应用样式时，哪些规则将优先应用的。CSS中的4个0计算法则是一种用于计算选择器权重的方法，它将选择器分成不同的等级并赋予不同的权重。

选择器               权重值
-------------------------------------
#id                 100       
.class              10        
tag                 1         
*                   0 

选择器权重将由每种选择器的权重值相加得到。因此，对于以下CSS规则：

#main .content p {
  color: red;
} 

其选择器权重将为：100 + 10 + 1 = 111。

有时候，选择器权重会影响到样式的应用。例如：

#main .content p {
  color: red;
}
p {
  color: blue;
} 

在此例中，由于第二个规则使用了更具体的选择器（即标签选择器），因此其选择器权重为1，比第一个规则的权重要小。因此，段落元素将应用蓝色而不是红色的颜色。

理解CSS选择器权重和4个0计算法则是编写高效，可维护的CSS代码的关键之一。请确保您在编写CSS规则时，充分理解并准确计算选择器权重。