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专业人士(或非专业人士,但比我聪明)是否有任何解决方法?感谢大家的关注和分享您的解决方案。

相关问答

依赖报错 idea导入项目后依赖报错,解决方案:https://blog....
错误1:代码生成器依赖和mybatis依赖冲突 启动项目时报错如下...
错误1:gradle项目控制台输出为乱码 # 解决方案:https://bl...
错误还原:在查询的过程中,传入的workType为0时,该条件不起...
报错如下,gcc版本太低 ^ server.c:5346:31: 错误:‘struct...