SCSS:如何将两个 类 与一个符号一起使用?
SCSS: How to use two classes together with an ampersand?
我有一些要应用于主按钮的 css 规则,我做了这样的事情:
.my-btn {
&--primary {
padding: 10px;
}
}
现在我想对 "sm" class 的主按钮应用相同的规则,我可以这样做:
.my-btn {
&--primary, &--primary.my-btn--sm {
padding: 10px;
}
}
这对我有用。但我也想对 "sm" 使用“&”,像这样:
.my-btn {
&--primary, &--primary.&--sm {
padding: 10px;
}
}
可能吗?
在这种情况下,解决方案可能是使用变量:
.my-btn {
$this: &;
&--primary, &--primary#{$this}--sm {
padding: 10px;
}
}
或者使用插值语法
.my-btn {
&--primary, &--primary#{&}--sm {
padding: 10px;
}
}