css面试点-样式优先级详解

总结排序：!important > 行内样式 > ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性

选择器的特殊性值(Specificity)表述为4个部分，用0,0,0,0表示

• 最后比较特殊的一个标志!important（权重），它没有特殊性值，但它的优先级是最高的，为了方便记忆，可以认为它的权重表示1.0.0.0.0。 权值：10000
• 行内样式：行内只有一个 style = ""，权重表示 1.0.0.0。 权值：1000
• ID选择器的特殊性值，权重表示 0.1.0.0。 权值：100
• 类(class)选择器、属性选择器或伪类，权重表示 0.0.1.0。 权值：10
• 元素和伪元素，加0,0,0,1。 权重表示 ：0.0.0.1 。权值：1
• 通配选择器*，子选择器，相邻同胞选择器对特殊性没有贡献， 权重表示 ：0.0.0.0。 权值：0

比较规则就是三点

• 先从高等级进行比较，高等级相同时，再比较低等级的，以此类推；
• 完全相同的话，就采用 后者优先原则（也就是样式覆盖）；
• css属性后面加 !important 时，无条件绝对优先（比内联样式还要优先）；