问题描述
对于Sass 3.2和更早版本,这些是使用父选择器的所有有效方法:
.foo {
&, &.bar, &#bar, &:after, &[active] {
color: red;
}
}
.foo {
.bar & {
color: red;
}
}
从Sass 3.3开始,这是有效的:
.foo {
&bar, &-bar {
color: red;
}
}
从Sass 3.4开始,这是有效的:
.foo {
$foo: &;
@at-root bar#{&} {
color: red;
}
}
解决方法
我遇到了一个问题。我有这个mixin(这是尝试将更少的端口移植到sass):
@mixin button-variant($color,$background,$border)
{
...
.foreverAlone{
...
}
.iThink .illNeverWork& {
color: $pinkUnicornRainbow;
...
}
}
显然这是行不通的:D我希望它生成如下内容:
.callerClass .foreverAlone{
...
}
.callerClass .iThink .illNeverWork.callerClass{
color: #123ABC;
...
}
mixin在各种div类中被调用,因此不可能(轻松)使其变为静态。
Sass专业人士(或非专业人士,但比我聪明)是否有任何解决方法?感谢大家的关注和分享您的解决方案。