CSS attribute selector + descendant gives a bug in Webkit?(CSS 属性选择器 + 后代在 Webkit 中出现错误?)
问题描述
考虑一下这个 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 中出现错误?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:CSS 属性选择器 + 后代在 Webkit 中出现错误?
- 失败的 Canvas 360 jquery 插件 2022-01-01
- 400或500级别的HTTP响应 2022-01-01
- 如何使用 JSON 格式的 jQuery AJAX 从 .cfm 页面输出查 2022-01-01
- CSS媒体查询(最大高度)不起作用,但为什么? 2022-01-01
- 使用RSelum从网站(报纸档案)中抓取多个网页 2022-09-06
- addEventListener 在 IE 11 中不起作用 2022-01-01
- Css:将嵌套元素定位在父元素边界之外一点 2022-09-07
- Quasar 2+Apollo:错误:找不到ID为默认的Apollo客户端。如果您在组件设置之外,请使用ProvideApolloClient() 2022-01-01
- Flexslider 箭头未正确显示 2022-01-01
- Fetch API 如何获取响应体? 2022-01-01