CSS分组和嵌套

CSS分组选择器允许一次性地为多个选择器指定相同的样式，从而减少代码量；CSS嵌套选择器允许在选择器内部使用其他选择器来进行更灵活和精细的样式定义。CSS分组和嵌套选择器都是提高 CSS 代码效率和可读性的重要技术。

一、CSS分组选择器

在样式表中，有许多具有相同样式的元素。为了减少重复的代码，可以使用CSS分组选择器来将这些元素归为一组，并为它们统一设置样式。

实例：

h1{
color:green;
}
h2{
color:green;
}
p{
color:green;
}

注意：每个选择器用逗号分隔。

在下面的例子中，我们对以上代码使用分组选择器：

h1,h2,p{
color:green;
}

注意：可以对任意多个选择器进行分组，CSS 对此没有任何限制。

二、CSS嵌套选择器

CSS嵌套选择器是指在一个选择器的内部定义另一个选择器，并为其设置样式。这种技术可以提高代码的层次结构和可维护性。在下面的例子，为所有 p 元素指定一个样式，为所有元素指定一个 class="marked"的样式，并仅用于class="标记"，类内的 p 元素指定第三个样式：

p{
color:blue;
text-align:center;
}
.marked{
background-color:red;
}
.marked p{
color:white;
}