怎么用!在SASS mixin中默认？

Question

我有这个SASS mixin:

@mixin micro-clearfix
    &:after,
    &:before
        content: ""
        display: table
    &:after
        clear: both
    * html &
        height: 1% !default
    *+html &
        min-height: 1% !default

不幸的是,它没有编译,除非我删除!default哪个是这个mixin的重点.

我得到的错误信息是:

Invalid CSS after "1% ": expected expression (e.g. 1px, bold), was "!default")

我想要实现的是,如果已经为选择器定义了height(或min-height),则mixin应该使用该值,否则它应该将此属性定义为1%.

我不想使用,zoom因为那不是一个有效的属性,我喜欢保持我的CSS干净.

我用!default错了方法吗？

我有Compass 0.12.1和SASS 3.1.10.

Answer 1

!default仅在声明变量时使用:http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#variable_defaults_

您要做的事情应该使用CSS !important声明,该声明应该在mixin之外的规则中使用(您想要获胜的规则).无论如何,!important通常使用它并不是一个好习惯.也许你可以依靠级联或特异性.

Answer 2

这是我最终如何做到的:

@mixin micro-clearfix
    $minHeight: 1% !default
    &:after,
    &:before
        content: ""
        display: table
    &:after
        clear: both
    * html &
        height: $minHeight
    *+html &
        min-height: $minHeight