Question

一段时间以来，我正在使用一种我认为很聪明的小技巧。

即组合相同的css选择器以增加规则选择器的特异性。

CSS Specs确实提到：

注意：允许和重复出现相同的简单选择器确实增加特异性。

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覆盖样式，标题中的事件......

（我这样做是因为我讨厌使用!important。对我而言，应该不惜一切代价避免这种情况。）

第一个选择器重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建议的那样，我在这里提交了一份报告：

https://connect.microsoft.com/IE/feedbackdetail/view/958790/repeated-occurrences-of-the-same-simple-selector-should-increase-specificity-even-with-ids

Answer 1

是的，根据F12中显示的行为来判断，这绝对是一个错误。它也违反了规范，如果你解释＆＃34;确实增加特异性＆＃34;因为＆＃34;必须增加特异性＆＃34;。此问题似乎只影响ID选择器。类选择器，属性选择器和伪类都可以。

之前似乎已经报告过，当我搜索Microsoft Connect时，它会显示现有报告，但由于某种原因我无法查看。这个问题仍然存在于IE11中;如果您无法查看报告，请随意提交另一份报告。

#id＃id：重复出现的同一个简单选择器应该增加特异性，但不要求IE9中的ID

1 个答案: