CSS优先级和计算特殊性值

CSS优先级

1. 同类型，同级别的样式后者先于前者(后者会覆盖前者)
2. ID > 类样式 > 标签 > *
3. 内联>ID选择器>伪类>属性选择器>类选择器>标签选择器>通用选择器(*)>继承的样式
4. 具体 > 泛化的，特殊性即css优先级
5. !important 权重最高，比 inline style 还要高
6. 近的 > 远的 (内嵌样式 > 内部样式表 > 外联样式表)

• 内嵌样式：内嵌在元素中，<span style="color:red">span</span>
• 内部样式表：在页面中的样式，写在<style></style>中的样式
• 外联样式表：单独存在一个css文件中，通过link引入或import导入的样式

计算特殊性值(权重法)：

!important > 内嵌 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 继承 > 通配符
CSS样式选择器分为4个等级，a、b、c、d

1. 如果样式是行内样式（通过Style=“”定义），那么a=1000 
2. b为ID选择器的总数 b=100 
3. c为属性选择器，伪类选择器和class类选择器的数量c=10
4. d为标签、伪元素选择器的数量d=1
5. !important 权重最高，比 inline style 还要高

当一个元素被嵌套在多重标签内时，要判断优先级，可以采用给不用的选择器设置权重，比较最后的权重数，最后服从权重最大的的样式。