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

Question

你好伙伴们，

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

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

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

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

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

感谢所有人的帖子。

Answer 1

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

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

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