●Specificity
本节讲述的是用来判断样式优先权的是“specificity”。“specificity”和选择符selector中元素的数目以及元素的属性有关,“specificity”高的优先应用。
怎样计算选择符的“specificity”值呢?涉及到三项内容:
1.选择符中ID标识符属性的数目A
注意:一个匹配ID的属性选择符不能算作一个ID,它仅能当作一个属性选择符.例如”id = value”的specificity值远远小于”#_value”
2.选择符中其它属性、伪类的数目B
注意:Class类选择符是属性选择符的一种.
3.选择符中标识、伪元素的数目C
例外:如果样式规则内嵌到一个式样属性内,它并不具备selector、此时它的specificity要比其它任何selector都高.
这三个值通过逗号“连”在一起构成一个加权值。举例如下:
List
A
B
C
Specificity
#blurb { …}
1
1
0
1,0,0
.message.big { … }
0
1
1
0,1,1
div.message { … }
0
1
1
0,1,1
.message { … }
0
1
0
0,1,0
div { … }
0
0
1
0,0,1
* { … }
0
0
0
0,0,0
#id1 { … }
1
0
0
1,0,0
UL UL LI.red { … }
0
1
3
0,1,3
LI.red { … }
0
1
1
0,1,1
LI { … }
0
0
1
0,0,1
#z { … }
1
0
0
1,0,0
UL LI { … }
0
0
2
0,0,2
UL OL+LI { … }
0
0
3
0,0,3
H1 + *[REL=up]{ … }
0
1
1
0,1,1
UL OL LI.red { … }
0
1
3
0,1,3
LI.red.level { … }
0
2
1
0,2,1
#x34y { … }
1
0
0
1,0,0
H1 {(simple selector)}
0
0
1
0,0,1
P EM {(contextual selector)}
0
0
2
0,0,2
.grape {(class selector)}
0
1
0
0,1,0
P.bright {(element/class selector combo)}
0
1
1
0,1,1
P.bright EM.dark {(contextual element/class)}
0
2
2
0,2,2
第 1 2 页