css的权重值 |背景颜色 css

选择器                 权重值
inline样式                      1000
id选择器                       100
类选择器、属性选择器、伪类选择器   10
元素选择器、伪元素选择器           1
通配符(*)、组合选择器              0

在CSS中，选择器的权重值是通过一组数字来表示的，这组数字对应于不同类型的选择器。如果多个选择器具有相同的权重值，则后面的规则将覆盖先前的规则。

因此，在编写CSS规则时，尤其要注意权重值。如果多个规则应用于同一个元素并产生了冲突，则需要手动使用!important标记来指示哪些规则具有更高的优先级。

#example {
background-color: red !important;
}
p {
background-color: blue;
}

在这个示例中，由于!important标记的存在，ID选择器的背景色将覆盖所有段落元素的背景色。

最好的实践是避免使用!important规则，而是使用具有正确的权重值的选择器来编写您的CSS。这可以防止出现意外的样式错误，并使您的样式表更易于维护。