如何解决SASS中的选择器的结尾和部分的与号&
对于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专业人士(或非专业人士,但比我聪明)是否有任何解决方法?感谢大家的关注和分享您的解决方案。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。