我目前正在使用罗盘框架和所有有用的CSS3 mixins.我想使用border-radius(5px)
mixin并拥有来自它的所有属性标记!important
在LESS中,可以!important
通过在调用后简单地指定它来应用于mixin中的所有属性
.myMixin(@x) { border-radius: @x; -moz-border-radius: @x; } .myClass { .myMixin(5px) !important; }
编译成
.myClass { border-radius: 5px !important; -moz-border-radius: 5px !important; }
在SASS中这是可能的,还是我必须用一个重要的参数重写mixins?
@mixin my-border-radius($value, $important: false) { border-radius: @value if($important, !important, null); .... }
cander.. 29
答案太明显了......
!important
可以简单地指定为属性值的一部分
border-radius(5px !important);
小智.. 8
Cander的答案适用于简单变量,其后没有任何其他属性。对于更复杂的CSS,您可以这样做,例如transition属性:
@mixin transition($ duration,$ content:null){ -webkit-transition:所有$ duration线性$ content; -moz-transition:所有$ duration线性$ content; -o-transition:所有$ duration线性$ content; 过渡:所有$ duration线性$ content; }
我添加了$content
变量并将其设置为null
。现在,您可以使用以下命令来简单地调用mixin:
@include transition(0.3s);
如果要添加!important
,请使用
@include transition(0.3s, !important);
谢谢!
答案太明显了......
!important
可以简单地指定为属性值的一部分
border-radius(5px !important);
Cander的答案适用于简单变量,其后没有任何其他属性。对于更复杂的CSS,您可以这样做,例如transition属性:
@mixin transition($ duration,$ content:null){ -webkit-transition:所有$ duration线性$ content; -moz-transition:所有$ duration线性$ content; -o-transition:所有$ duration线性$ content; 过渡:所有$ duration线性$ content; }
我添加了$content
变量并将其设置为null
。现在,您可以使用以下命令来简单地调用mixin:
@include transition(0.3s);
如果要添加!important
,请使用
@include transition(0.3s, !important);
谢谢!