html - 将伪类样式应用于所有前面的类

Question

因此，如果我应用如下样式:

.class1, .class2, .class3 {}

有什么方法可以在同一行中应用这些类的特定伪样式而不重复所有类名？

Answer 1

我有时会使用 stylus ，stylus 是一个 CSS 预编译器。对于您的情况，我将举例说明它在 stylus 中的外观。

.class1 , .class2 , .class3
  color red
  background-color blue 
     &:hover 
          color blue
          background-color red

上面的这段代码会像这样自动将代码预编译到你的 .css 文件中

.class1,
.class2,
.class3 {
  color: #f00;
  background-color: #00f;
}
.class1:hover,
.class2:hover,
.class3:hover {
  color: #00f;
  background-color: #f00;
}

如果你运行 SASS/LESS，它看起来几乎一样，但有作用域。