問題描述
考慮一下這個 CSS:
Consider this CSS:
[data-color="red"] h1 {
background-color:red;
}
[data-color="blue"] h1 {
background-color:blue;
}
還有這個 HTML:
<div data-color="red">
<h1>red</h1>
</div>
<div data-color="blue">
<h1>blue</h1>
</div>
<div data-color="blue">
<h1>blue</h1>
</div>
現在看一下上面代碼在 Webkit 和任何其他瀏覽器中的以下演示:
http://jsfiddle.net/aUCkn/
Now take a look at the following demo of the above code in Webkit and any other browser:
http://jsfiddle.net/aUCkn/
奇怪的是，如果你把每個 h1 放在同一行，即:
What's strange is that if you put each h1 on the same line, i.e.:
<div data-color="red"><h1>red</h1>
</div>
<div data-color="blue"><h1>blue</h1>
</div>
<div data-color="blue"><h1>blue</h1>
</div>
它也適用于 Webkit:
http://jsfiddle.net/aUCkn/1/
It works in Webkit too:
http://jsfiddle.net/aUCkn/1/
有人知道這是從哪里來的嗎?是我做錯了什么還是 Webkit 在這里表現得很愚蠢?
Does anyone know where this comes from? Am I doing something wrong or is Webkit acting stupid here?
推薦答案
第一個 jsFiddle 在我的 Chrome 12.0.742.112 (stable) 中壞了.
The first jsFiddle is broken in my Chrome 12.0.742.112 (stable).
但是，它適用于我的 Chrome 14.0.803.0 dev-m.
However, it works in my Chrome 14.0.803.0 dev-m.
因此，他們已經意識到并修復了該錯誤.您只需等待修復程序進入穩定頻道即可.
So, they're already aware of and have fixed the bug. You just have to wait for the fix to land in the stable channel.
如果存在錯誤報告，我將嘗試查找錯誤報告的鏈接.
I'll try to find a link to a bug report, if one exists.
這篇關于CSS 屬性選擇器 + 后代在 Webkit 中出現錯誤?的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！