Sass SCSS扩展的使用

我们有很多定位元素，我正在考虑将我发现的模式抽象成一些可以反复使用的帮助器类

.pos {
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
}

.pos--fixed  { position:fixed; }

.pos--bottom { top:    auto; }
.pos--top    { bottom: auto; }
.pos--left   { right:  auto; }
.pos--right  { left:   auto; }

使用@extend功能，我希望稍后在我们的模块中使用它，如下所示：

.module__element1 {
  @extend .pos;
  @extend .pos--top;
}

.module__element2 {
  @extend .pos;
  @extend .pos--bottom;
}

这被认为是一个好方法吗？我想是的，但我的同事们有疑问（他们无法真正解释）

这就是为什么我认为它是：

• pos类别或我们定位元素的方式不太可能改变
• 是的，它在最终的css文件中生成更多的选择器，但生成的代码更少
• 它使scss源文件更易于读取和维护

---

我希望我能在这里得到一些意见，而不仅仅是怀疑：）

基于意见的问题在这里是不受欢迎的。就我个人而言，我没有发现使用extends会使代码更具可读性。如果您认为这会减少代码，那么您只是在愚弄自己。如果计算字符数，

@extend.pos@extend.pos——底部大于
位置：固定；底部：自动
。另请参见：我并不是说scss文件中的代码更少，我是说生成的css-file中的代码更少。对，正如我提供的链接所示，css文件中的代码也更多。位置：固定；底部：自动；！=位置：固定；排名：0；左：0；右：0；底部：自动；但我明白你的意思。pos就足够了。