Я вижу что-то довольно странное в Chrome 10 с :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: ""
}
Кто-нибудь может объяснить, почему <li>Four</li>
отображается со звездочкой в Chrome 10.0.648.204 в Win XP SP3? См. 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 отображают оба примера одинаково. Я безуспешно просмотрел книгу Мейера и спецификацию CSS в поисках объяснения, и валидатор CSS не жалуется на CSS.
Крайне странно то, что если я проверяю элемент в Chrome, он показывает, что li:first-child:before
переопределяет правило li:before
.
JSFiddle использует XHTML 1.0 Strict DOCTYPE, но я также вижу это с DOCTYPE HTML5.
Спасибо.
РЕДАКТИРОВАТЬ 28 апреля 2011 г.: похоже, это было исправлено в Chrome 11.0.696.57, наряду с другими подобными проблемами, связанными с псевдоэлементами.