将calc函数中的值存储为scss中的变量

时间:2014-08-28 20:04:33

标签: sass

你好伙伴们,

我刚刚开始使用SCSS;这真是太棒了!我有一个关于变量的问题。我想要计算div的宽度加上它在导航元素中的填充,边距和边框。我想要将计算出的宽度传递给这样的变量:

$numbDivs:       4;
$divWidth:       150px;
$divPadd:        10px;
$divBorderWidth: 1px;
$divMarg:        2px;

$navBreakPoint:  calc( #{$numbDivs} * ( #{$divWidth} + ( ( #{$divPadd} + #{$divBorderWidth} + #{$divMarg} ) * 2 ) ) );

我在没有#{}部分的情况下尝试过,而且没有用。

可能只是因为scss不支持这个......但它会很好。

感谢所有人的帖子。

1 个答案:

答案 0 :(得分:1)

calc()是CSS的功能,而不是Sass。如果要将结果存储为变量,请删除字符串插值并计算它:

$navBreakPoint:  $numbDivs * ($divWidth + (($divPadd + $divBorderWidth + $divMarg) * 2));

值得注意的是,calc()无法与媒体查询结合使用(请参阅:calc() not working within media queries