css权重优先级

 

CSS权重优先级指的是当多个CSS规则应用于同一个元素时，浏览器按一定规则确定应该应用哪一个规则。权重优先级是由选择器的特定组合决定的，其中包括内联样式、ID选择器、类选择器和元素选择器等。

 

内联样式具有*的优先级，即在HTML标签中直接使用style属性定义的样式，如`

`。由于内联样式直接写在元素标签上，它会覆盖其他选择器定义的样式。

 

接下来是ID选择器，即使用`#`符号来定义的选择器，它用于选取具有特定ID属性值的元素，如`

`。ID选择器的优先级高于类选择器和元素选择器。

 

然后是类选择器，即使用`.`符号来定义的选择器，它用于选取具有特定类名的元素，如`

`。类选择器的优先级仅低于内联样式和ID选择器。

 

*是元素选择器，即选取HTML元素类型的选择器，如`

`。元素选择器的优先级*，仅低于内联样式、ID选择器和类选择器。

 

此外，权重还可以通过选择器的特殊性进一步确定。特殊性可以通过选择器中ID选择器、类选择器和元素选择器的个数来计算。具体规则是：内联样式特殊性为1

 

 

0；ID选择器特殊性为0

1

 

0；类选择器和属性选择器特殊性为0

 

1

0；元素选择器和伪元素选择器特殊性为0

 

 

1。权重计算规则是：每个特殊性之间相应位置的数字相加，例如`#myDiv`的特殊性为0

1

 

0，而`.myClass`的特殊性为0

 

1

0。当出现特殊性相同时，后出现的选择器具有更高的优先级。

 

如果出现特殊性相同且位置相同的选择器，那么会比较谁写在样式表中的位置更靠后。通常情况下，后出现的样式定义会覆盖先前出现的定义。

 

总结起来，CSS权重优先级可以用以下顺序排列：内联样式 > ID选择器 > 类选择器 > 元素选择器。通过特殊性来确定优先级，特殊性相同时，后出现的选择器会覆盖前面出现的。这些规则可以帮助开发者更好地控制CSS样式的应用。