一段时间以来,我正在使用一种我认为很聪明的小技巧.
那就是组合相同的css选择器来增加规则选择器的特异性.
CSS Specs确实提到：
Note: Repeated occurrances of the same simple selector are allowed and
do increase specificity.
http://www.w3.org/TR/css3-selectors/#specificity
例如,如果HTML是
<body>
<section id="main">
<header class="titles">
<h2>Title red</h2>
<h2 class="blue">Title blue</h2>
</header>
<h2 class="blue">Title blue</h2>
</section>
</body>
和CSS
#main .titles h2{
color: red;
}
#main .blue.blue{
color: blue;
}
这样我就可以使用类.blue覆盖样式,标题中的事件……
(我这样做是因为我讨厌使用！重要.对我来说,应该不惜一切代价避免.)
第一个选择器重0111(1个id,1个等级,1个元素)
第二个选择器重量为0120(1个id,2个等级)
有时我用ID做.它在真正的浏览器中有效……
这个选择器：
#main#main .blue{}
应该称重0200,因为它有2个ID吗？
IE9(没有尝试其他人)不会在选择器中解释多个相同的ID.
此选择器不会覆盖IE9中的#main .titles h2 {} …
IE的css控制台显示一个等于#main .blue的计算选择器,并删除第二次出现…
这是为什么？
对我来说这只是另一个IE实现“bug”.
正如@BoltClock建议的那样,我在这里提交了一份报告：
