html5 嵌套选择器,CSS 分组 和 嵌套 选择器

CSS 分组 和 嵌套 选择器

所谓分组选择器就是当多个选择器对应的元素需要相同的样式时可以将多个选择器以逗号分隔放在一条样式声明的前面达到多个选择器多条样式声明相同的效果.

所谓嵌套选择器就是实现对选择器内部的选择器对应的元素实现样式的设置.css

在样式表中有很多具有相同样式的元素。h1{color:green;}

h2{color:green;}

p{color:green;}

为了尽量减少代码，你可以使用分组选择器。

每个选择器用逗号分隔.

在下面的例子中，我们对以上代码使用分组选择器：h1,h2,p{color:green;}

嵌套选择器

它可能适用于选择器内部的选择器的样式。

在下面的例子设置了三个样式：

为所有p元素指定一个样式

为所有class=”marked”的元素指定一个样式

为所有class=”marked”元素内的p元素指定一个样式html>

p{

color:blue;    text-align:center;}

.marked{    background-color:red;}

.marked p{    color:white;}

这个段落是蓝色文本，居中对齐。

这个段落不是蓝色文本。

所有 class="marked"元素内的 p 元素指定一个样式，但有不同的文本颜色。