SaSS仅扩展属性

Question

SaSS中是否可以仅扩展类的css属性，并避免呈现连接的类名：

.class_A {
    background-color: #f0f;
}

.class_B {
    color:#555;
    @extend class_A;
}

期望的结果：

.class_B {
    color:#555;
    background-color: #f0f;
}

Answer 1

如果您仍然需要.class_A，那么您可以执行此操作

%bg-color {
  background-color: #f0f;
}
.class_A {
    @extend %bg-color;
}

.class_B {
    color:#555;
    @extend %bg-color;
}

输出CSS：

.class_A, .class_B {
  background-color: #f0f;
}

.class_B {
  color: #555;
}

如果您不需要.class_A，只需使用变量：

$bg-color: #f0f;

.class_B {
    color:#555;
    background-color: $bg-color;
}