sass - 抽象超类

Question

我试图让 SASS 在编程中做一些类似于抽象超类的事情。我已经到了超类部分

.box {
  @include span-columns(1);
  @include border-radius(5px);
  height: 360px;
  overflow: hidden;
}


article {
  @extend .box;
}

figure {
  @extend .box;
}

这是一种无需在生成的 CSS 中复制框即可定义框的共性的方法，就像使用 mixin 时那样。但是，此解决方案存在为我并不真正需要和想要的（CSS）类“框”定义规则的缺陷。

可以肯定的是，这是一个小问题，但我仍然想知道是否有办法将“.box”制作为仅在 SASS 预处理期间使用且不会出现在 CSS 中的标签。

Answer 1

%您想使用 a而不是 a来定义您的“超类”.

%box {
  @include span-columns(1);
  @include border-radius(5px);
  height: 360px;
  overflow: hidden;
}

article {
  @extend %box;
}

figure {
  @extend %box;
}

请注意，这需要版本 3.2+