通配选择器

概述

在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 初始定义

浏览器兼容性

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 ? ? ? ? ? ?

相关链接

文档标签和贡献者

标签: 
 此页面的贡献者: HomeLH, fscholz, xiaolong, iwillbe, teoli, ziyunfei
 最后编辑者: HomeLH,