Question

以下是样本：

.my-class {
  font-size: 12px;
}

.my-another-class {
  /* here I want to include .my-class style */
  .my-class;
  border: 0;
}

我可以将一个css类包含在另一个中吗？

Answer 1

您可以为.my-class规则定义多个目标，然后为.my-another-class指定更多规则：

.my-class,
.my-another-class {
  font-size: 12px;
}

.my-another-class {
  border: 0;
}

您甚至可以覆盖某些属性，例如

.my-class,
.my-another-class {
  color: red;
  font-size: 12px;
}

.my-another-class {
  border: 0;
  color: blue; /* overrides color: red; on .my-another-class */
}

Answer 2

你不能在纯CSS中使用这样的结构。

Less和Sass等预处理器使用mixins支持此行为。

Answer 3

你不能，但你可以这样做：

.my-class, .my-another-class{
  font-size: 12px;
}

.my-another-class {
  border: 0;
}

如何从另一个引用CSS样式？

3 个答案: