Stylus 中的 DRY 原理与 LESS 相比

Question

假设我们在LESS中有以下内容：

.large-heading {
   font-family:Helvetica, Arial, sans-serif;
   font-weight:bold;
   font-size:24px;
   text-transform:uppercase;
   line-height:1.2em;
   color:#ccc;
}
.med-heading {
   .large-heading;
   font-size:18px;
}

完美的工作。我想有同样的效果，不要用Stylus把拳头的属性重复到秒。我怎样才能做到这一点？我在 Stylus 上tried 上一个，但它不起作用。

Answer 1

我猜你在找this

这是一个简单的例子

.a
  color: red

.b
  width: 100px

.c
  @extend .a, .b
  height: 200px

哪个输出

.a,
.c {
  color: #f00;
}
.b,
.c {
  width: 100px;
}
.c {
  height: 200px;
}