CSS的特殊性 (specificity)

特殊性是一个选择器"特殊程度"的数字表示。它可以描述成一个4个位置的点数串: 0.0.0.0 。为帮助理解,我们甚至可以将其看成一个四位的数值,数值越大的特殊性越高(例如:0.1.0.0(100)>0.0.1.2(12)),特殊性越高的属性会覆盖特殊性较低的属性.

用值表示:
每个内联样式(body)的特殊性为 1.0.0.0(1000)
每个ID选择器的特殊性为 0.1.0.0(100)
每个类或者伪类的特殊性为 0.0.1.0(10)
每个元素和伪元素的特殊性为 0.0.0.1(1)
连接符和通配符为 0.0.0.0(0)

例如:

p a{color:red}  
body * a{color:blue}

两者特殊性相同。

继承不具有特殊性,也就是说:继承特殊性比*还小,连0都没有(可以这样理解而已)。

例如:

*{color:red}
p{color:blue}
<p>I'm blue<b>I'm red</b></p>

浏览器中:p标签内aaaaaaa为蓝色,b标签内为红色。

写在HTML页面中的头部内联样式(style)会覆盖外链样式(link)中相同属性设定。

设定了!important(重要声明)的属性特殊性最高,也就是说比body内内联样式更高!


原文地址:https://www.cnblogs.com/mimifeng/p/3360417.html