与LESS相比,Stylus的DRY原理



假设我们在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;
}

可以很好地工作。我想有同样的效果,不要重复的属性的第一个到第二个使用手写笔。我怎样才能做到呢?

我猜你在找这个

下面是一个简单的例子

.a
  color: red
.b
  width: 100px
.c
  @extend .a, .b
  height: 200px

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

最新更新