Question

我在Chrome 10 w / :first-child:before中看到了一些奇怪的东西。

使用此HTML

<ul>
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
</ul>

<ul>
    <li>Four</li>
    <li>Five</li>
    <li>Siz</li>
</ul>

和这个CSS

ul {
    list-style-type: none
}

li:before {
    content: "* "
}

li:first-child:before {
    content: ""
}

在Win XP SP3的Chrome 10.0.648.204中，有人可以解释为什么<li>Four</li>使用星号呈现？见http://jsfiddle.net/MxtHm/

但如果我将CSS更改为

ul {
    list-style-type: none
}

li:before {
    content: "* "
}

li:first-child {
    background: none
}

li:first-child:before {
    content: ""
}

<li>Four</li>在没有星号的情况下渲染。见http://jsfiddle.net/SGRej/

Safari 5.0.4和Firefox 3.6.16使两个示例都相同。我已经阅读了Meyer的书和CSS规范，寻找没有任何运气的解释，CSS验证器并没有抱怨CSS。

非常奇怪的是，如果我在Chrome中检查元素，则表明li:first-child:before覆盖了li:before规则。

JSFiddle正在使用XHTML 1.0 Strict DOCTYPE，但我也看到HTML5 DOCTYPE。

感谢。

2011-04-28编辑：这似乎已在Chrome 11.0.696.57中修复，以及其他类似的与伪元素相关的问题。

Answer 1

我有理由相信你会被我回答的上一个问题中的同一个问题所困扰：

我发现了明显的事实，因为它是一个错误，并且发现了一些错误报告确认了它。

其他人找到了一个奇怪的解决方法;看到接受的答案。