SCSS中如何实现类似LESS的类属性混入效果？

如果你想实现和你提供的LESS代码完全一致的混入效果，SCSS里最简洁的方式就是直接在目标选择器中调用已定义的类选择器（无需加括号）：

.foo {
    color: red;
}

.boo {
    .foo; // 直接复用.foo的所有属性
    background: blue;
}

这段代码编译后生成的CSS和你用LESS实现的结果完全相同：

.foo {
    color: red;
}

.boo {
    color: red;
    background: blue;
}

如果后续需要参数化的混入逻辑，你也可以用@mixin定义可复用片段，再通过@include调用，但对于你当前的场景，直接调用已有类的写法是最简单直接的。

内容的提问来源于stack exchange，提问作者Luca Detomi