css权重（css权重值）

CSS权重是用于确定在多个选择器作用于同一元素时，哪个属性会被应用的计算规则。理解CSS权重对于开发高效且精准的样式特别重要。

一、权重的定义

CSS权重是由四个值构成的，它们按顺序是：内联样式（1000），ID选择器（100），类选择器、伪类选择器和属性选择器（10），元素选择器和伪元素选择器（1）。

二、权重的计算

当多个选择器针对同一元素使用时，会根据它们的权重来计算。权重值越高的样式会优先应用。以下是一些例子，以帮助您理解计算规则。

- 给定的选择器是div#example p，它包含一个ID选择器和一个元素选择器。因为ID选择器的权重值是100，元素选择器的权重值是1，所以在此情况下，ID选择器的样式会被优先应用。

- 给定的选择器是div.example，它包含一个类选择器和一个元素选择器。因为类选择器的权重值是10，元素选择器的权重值是1，所以在此情况下，类选择器的样式会被优先应用。

- 给定的选择器是div.example p，它包含一个类选择器、一个元素选择器和一个后代选择器。因为类选择器的权重值是10，元素选择器的权重值是1，后代选择器的权重值是0，所以在此情况下，类选择器的样式会被优先应用。

三、一些重要的注意事项

- 当选择器是完全相等的时候，后面的样式将被首先应用，因为它们覆盖前面的样式。

- 当链接样式表时，后面的样式表将优先于前面的样式表。

- 绝对定位元素的权重值小于相对定位元素，因为它们的层级不同。

- 通配符选择器（*）的权重值是0，但如果与其他选择器一起使用，会增加其权重值。

总之，CSS权重是一种非常重要的计算规则，它能够决定哪个样式将应用于已选择的元素。了解权重的计算规则可以帮助开发者更有效地编写样式，并且确保最终的样式是正确的。