通配选择器 - CSS(层叠样式表) 编辑
概述
在CSS中,一个星号(*
)就是一个通配选择器.它可以匹配任意类型的HTML元素.在配合其他简单选择器的时候,省略掉通配选择器会有同样的效果.比如,*.warning
和.warning
的效果完全相同.
在CSS3中,星号(*
)可以和命名空间组合使用:
ns|*
- 会匹配ns
命名空间下的所有元素*|*
- 会匹配所有命名空间下的所有元素|*
- 会匹配所有没有命名空间的元素
示例
*[lang^=en]{color:green;}
*.warning {color:red;}
*#maincontent {border: 1px solid blue;}
上面的CSS作用于下面的HTML:
<p class="warning">
<span lang="en-us">A green span</span> in a red paragraph.
</p>
<p id="maincontent" lang="en-gb">
<span class="warning">A red span</span> in a green paragraph.
</p>
则会产生这样的效果:
A green span in a red paragraph.
A red span in a green paragraph (with a border.)
注: 笔者不推荐使用通配选择器,因为它是性能最低的一个CSS选择器.规范
Specification | Status | Comment |
---|---|---|
CSS Selectors Level 3 | Recommendation | 定义了在命名空间下的行为并提示在伪元素中忽略它是允许的 |
CSS 2.1 | Recommendation | 初始定义 |
浏览器兼容性
We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | (Yes) | 1.0 (1.7 or earlier) | 7 | (Yes) | (Yes) |
Combination with namespace support | (Yes) | 1.0 (1.7 or earlier) | 9 | 8 | 1.3 |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | ? | ? | 1.0 (1) | ? | ? | ? |
Combination with namespace support | ? | ? | ? | ? | ? | ? |
相关链接
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论