如何在SASS mixin中使用!default？

Question

我有这个 SASS mixin：

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

很遗憾，如果我不删除!default，代码就无法编译通过，但这是这个混合器的意义所在。

我得到的错误消息是：

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。

- Wabbitseason

---

!default 用于 Sass 变量声明，而非 CSS 属性。 - BoltClock

Answer 1

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

你试图做的应该使用CSS !important声明来完成，该声明应该在mixin外部的规则中使用（您希望它优先）。 无论如何，通常不建议使用!important。也许您可以依赖于层叠或特异性。

- Waiting for Dev...

---

谢谢您的回复，但是正如您所提到的，使用！important通常是不可取的，因此我不能接受您的答案，而且我已经自己找到了解决方案。 - Wabbitseason

Answer 2

这是我最终的做法：

以下是我的具体步骤：

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

- Wabbitseason

---

为什么不将 $minHeight 传递给你的 mixin，并像 @mixin micro-clearfix($minHeight: 1%) 这样设置默认值呢？ - maxbeatty