【CSS选择符】群组选择符 和 通用选择符

微信订阅号：rabbit_svip

有时候我们需要一种简单的方式把相同的格式应用到不同的元素上。例如，可能想让网页中的所有标题使用相同的颜色和字体显示。如果分别为每一级标题（h1, h2, h3, h4等）定义样式，工作量会很大，如果日后要修改所有标题的颜色，要修改6个不同的样式。
遇到这种需求时，最好使用群组选择符，把一个样式指定给多个选择符。

群组选择符

群组选择符由一系列逗号分开的选择符组成。因此，如果想让所有标题都使用相同的颜色，可以编写如下规则：

CSS代码：

h1, h2, h3, h4, h5, h6 {
    color: #1574A8;
}

群组选择符中可以使用任何有效的选择符（可以多种选择符混用）。例如，把相同的文字颜色应用到<h1>标签、<p>标签、类为.copyright的标签和ID为#banner的标签上。

CSS代码：

h1, p, .copyright, #banner {
    color: #1574A8;
}

如果网页中的多个元素只要共用部分格式属性，可以使用群组选择符编写共用的那部分，再分别为各个选择符编写专属的属性。

---

通用选择符（星号）

通用选择符可以理解成超级群组选择符。
通用选择符的作用是选取所有标签。

比如最常用的是让所有元素的margin和padding默认为0，可以这样写：

CSS代码：

* {
    margin: 0;
    padding: 0;
}

通用选择器不指定任何具体的标签类型，因此很难预测对使用各种HTML标签的网站有什么影响。
所以通用选择器里面的样式不要写得太过分，把一些基础的东西写在里面就行。比如规定margin、padding、font-size等。

滥用通用选择符，很可能会加大浏览器的渲染压力。

---

HTML与CSS 目录：HTML与CSS

上一篇：【CSS选择符】类选择符 和 ID选择符

下一篇：【CSS选择符】后代选择符