如何将表达式传递给使用Sass变量的calc（）mixin

我设置了一个mixin来进行跨浏览器计算

@mixin calc($property, $expression...) { 
  #{$property}: -moz-calc(#{$expression}); 
  #{$property}: -o-calc(#{$expression}); 
  #{$property}: -webkit-calc(#{$expression}); 
  #{$property}: calc(#{$expression}); 
} 

我还有一个变量

$line: 12px;

我希望能够在其中使用一个变量

@include calc(width, "30% - ( $line * 2) ) ");

---

但我不确定这是不是最好的办法

需要对传递给mixin的值使用字符串插值：

.foo {
  @include calc(width, #{"30% -  #{$line * 2}"});
}

输出：

.foo {
  width: -moz-calc(30% - 24px);
  width: -o-calc(30% - 24px);
  width: -webkit-calc(30% - 24px);
  width: calc(30% - 24px);
}

---

没有理由为Opera添加前缀，因为Opera根本不支持

calc（）

。当他们最终支持它的时候，根本没有理由期待它被加上前缀。可能的重复访问这是否回答了你的问题？