Html 有没有办法对CSS元素/选择器进行分组？

目前我有一些类似于：

.class1 p {
    blablabla
}

.class1 h1 {
    blaaa
}

.class1 a {
    bla bla bla
}

我有没有办法把它压缩得更细，让它看起来更整洁？最后，我得到了40个左右的.class1条目，这是一个令人讨厌的问题

编辑：我的意思不是让它们都不同（例如h1是黑色的，p是红色的），而是压缩写入时占用的空间，使其看起来更简单

---

tl；dr组选择器？

使用

，

将选择分组如下：

.class1 p, .class1 h1, .class1 a{
   color: red;
}

---

您可以看看CSS预处理器，例如或，它允许您使用嵌套。例如，在

.less

文件中，它看起来像：

.class {
    p {
        ....
    }

    h1 {
        ....
    }

    a {
        ....
    }
}

---

并且仍然编译成

.css

文件中的代码示例。然而，如果你沿着这条路线走下去，请确保不要开始嵌套太深，因为这将创建真正特定的选择器

对不起，我没有正确解释我的意思。我的意思不是让它们都不同（例如，h1是黑色的，p是红色的），而是压缩它在编写时占用的空间，使其看起来更简单。使用较少的或sass，正如@ckuijjer为您所回答的那样，值得一提的是，编译后的CSS看起来与原始代码没有什么不同。prep处理器只会使CSS更容易编写。Less看起来很棒，谢谢！CSS预处理器的另一个简单的特性是变量。不要在任何地方重复相同的颜色，你可以定义它一次（例如

@brand color:#f99；

），然后使用它（例如

color:@brand color；

）@Paulie\u很好！试图让它更清楚有3个没有“CSS元素”。CSS选择器可以按照CSS规范中的定义进行分组。你所要求的看起来像是一个工具的要求，以使CSS代码“整洁”，即请你的眼睛和头脑，这是高度主观的。技术上你能做什么很大程度上取决于这些废话。你没有提出任何具体问题。