跳到主要内容位置

CSS 全体选择器

CSS 全体选择器用来选择全部的元素,适合做一些通用的样式调整,或者对不同的标签,设置统一的样式。

使用方法#

CSS 全体选择器使用 * 作为选择器名称,可以选择所有元素,在单独作为选择器进行选择时,会选择 HTML 页面上的所有元素,例如下方代码所示:

<style>  * {    box-sizing: border-box;    font-size: 18px;    color: #888;  }</style><div>  <p>这是一个段落</p></div><span>测试文本</span>

预览:

这里使用 * 选择了所有的元素:div、p 和 span,然后对它设置了统一的样式,例如文字大小和颜色。

CSS 全体选择器还可以和其它选择器进行组合使用,例如下方代码所示:


<style>  table tbody * {    padding: 12px;  }</style>
<table>  <thead>    <th>列1</th>    <th>列2</th>    <th>列3</th>  </thead>  <tbody>    <tr>      <td>单元格1</td>      <td>单元格2</td>      <td>单元格3</td>    </tr>    <tr>      <td>单元格4</td>      <td>单元格5</td>      <td>单元格6</td>    </tr>  </tbody></table>

预览:

示例中的 CSS 选择了 table 下的 tbody 子元素下的所有元素,给它们设置了间距。

小结#

CSS 全体选择器用于统一的给一组元素设置样式,也可以和其它选择器组合使用,这样无论它在什么位置,都会选择所有的元素。