css - 如何创建一个带有类作为变量的 Sass mixin

Question

我想写这样的东西:

@mixin variableChild($child:".theChild") {
    //some css
    $child {
     //css specific to the child
    }

}

#parent { @include variableChild(".specificChild"); };

所以它会生成这个 CSS:

#parent {//some css}
#parent .specificChild {
   //css specific to the child

}

Answer 1

您几乎是对的，我认为您只是错过了子选择器周围的 #{}。 Sass documentation 中有更多相关信息.

@mixin variableChild($child:".theChild") { 
    #{$child} {
        color: red;
    }
}

#parent {
    @include variableChild(".specificChild");
};

http://jsfiddle.net/UrLdB/