标签:
类型 | 计算规则 |
---|---|
元素标签中定义的样式(Style属性) | 加1,0,0,0 |
每个ID选择符(如 #id) | 加0,1,0,0 |
每个Class选择符(如 .class)、每个属性选择符(如 [attribute=])、每个伪类(如 :hover) | 加0,0,1,0 |
每个元素选择符(如p)或伪元素选择符(如 :firstchild)等 | 加0,0,0,1 |
其它选择符包括全局选择符*, 不过这也是一种specificity。 |
加0,0,0,0,相当于没加 |
选择器 | 计算结果 |
---|---|
* { } | 0 |
li { } | 1 (one element) |
li:first-line { } | 2 (one element, one pseudo-element) |
ul li { } | 2 (two elements) |
ul ol+li { } | 3 (three elements) |
h1 + *[rel=up] { } | 1,1 (one attribute, one element) |
ul ol li.red { } | 1,3 (one class, three elements) |
li.red.level { } | 2,1 (two classes, one element) |
style=”” | 1,0,0,0 (one inline styling) |
p { } | 1 (one HTML selector) |
div p { } | 2 (two HTML selectors) |
.sith | 1,0 (one class selector) |
div p.sith { } | 1,2 (two HTML selectors and a class selector) |
#sith | 1,0,0 (one id selector) |
body #darkside .sith p { } | 1,1,2 (HTML selector, id selector, class selector, HTML selector; 1+100+10+1) |
正常计算结果:
a:hover = div .yellowLink = a.yellowLink a:visited = div .yellowLink = a.yellowLink
IE6计算结果:
a:hover > div .yellowLink a:hover > a.yellowLink a:visited > div .yellowLink a:visited > a.yellowLink
解决办法:不给a定义伪类颜色(这种解决方案在“用户可用性”上并不好);或使用#id重置过来。
以上结论记不住也就算了,知道IE6中存在这个Bug就可以了。
标签:
原文地址:http://www.cnblogs.com/zhusheng2008/p/3920918.html