使用Compass Mixin添加！important

Question

如果我使用指南针CSS并使用函数或mixin如：

   @include background-image(linear-gradient(#a3cce0, #fff)); 

是否有任何简单的方法让罗盘添加！对它生成的每一行都很重要？

Answer 1

更新：现在新版本的sass支持这种语法：

@include border-radius(5px !important);

就这样做（如@naoufal回答中所述）。

---老答案---

你不能使用！重要的罗盘混合，但罪魁祸首不是指南针，你应该责怪sass。

@include border-radius(5px) !important; #=> SASS Syntax Error

Answer 2

您可以将它包含在mixin中，如下所示：

@include border-radius(5px !important);

指南针将输出以下内容：

-webkit-border-radius: 5px !important;
-moz-border-radius: 5px !important;
-ms-border-radius: 5px !important;
-o-border-radius: 5px !important;
border-radius: 5px !important;

Answer 3

我上次遇到这个问题而且我用更强的选择器覆盖罗盘样式。我刚刚在我的html元素上添加了一个ID

span { @include border-radius(5px);}

span#no-radius { @include border-radius(0px); } // override

Answer 4

这个问题出现在我寻找类似问题的时候，它就是现场，但我只想补充一点，Making a Sass mixin with optional arguments是另一种我觉得有用的方法。

用inset替换important并在需要时通过!important。

Answer 5

花了好几个小时搞清楚这一点，但你可以做一个快速的伎俩。在SASS文件的顶部添加以下内容：

$i: unquote("!important");

在你的风格做以下事项：

color: #CCCCCC $i;

输出是：

color: #CCCCCC !important;

完整样本：

$i: unquote("!important");

.some-style {
    color: white $i;
}

输出：

.some-style {
    color: white !important;
}