面试题之css选择器优先级

css优先级规则

• CSS 优先规则1： 最近的祖先样式比其他祖先样式优先级高。
• CSS 优先规则2："直接样式"比"祖先样式"优先级高。
• CSS 优先规则3： 优先级关系：内联样式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器
• CSS 优先规则4： 计算选择符中 ID 选择器的个数（a），计算选择符中类选择器、属性选择器以及伪类选择器的个数之和（b），计算选择符中标签选择器和伪元素选择器的个数之和（c）。按 a、b、c 的顺序依次比较大小，大的则优先级高，相等则比较下一个。若最后两个的选择符中 a、b、c 都相等，则按照"就近原则"来判断。

规则四，我们可以这样想：
首先，CSS的优先级是根据样式声明的特殊性值来判断的。
根据规则三可以把特殊性分为四个等级：如下：

1. 标签内选择符x,0,0,0
2. ID选择符0,x,0,0
3. class选择符/属性选择符/伪类选择符 0,0,x,0
4. 元素标签和伪元素选择符0,0,0,x

每个选择器初始值都为0 0 0 0 ，根据规则四，进行相应的加1，判断优先级时，从左向右判断，若两个优先级相等，则后出现的优先级大。
出现!important的权重最大。可以认为是1 0 0 0 0<