sass 中使用 calc 传入变量无效_html/css_WEB-ITnose

是的,我又用上 sass 了,新公司在用,所以就又写 sass 了。

然后今天遇到的小问题,随手记一下

当我们用 sass 写如下代码的时候

.class{    $padding: 5px;    width: calc(100% - $paddding * 2);}

嗯嗯,看上去好像很正常。。。

错!! 编译完了之后,你会发现这段代码是这样的

.class{    width: calc(100% - $padding * 2);}

然后浏览器就无情的忽略掉这一行谜一样的样式了

这尼玛是什么呀?! 摔!

好吧,看样子 sass 在编译的时候,把括号里面的变量当做字符串处理了。 所以我们该怎么办呢?

哈哈哈,对!还记得 sass 怎么在字符串里拼接变量么? 就是它!

.class{    $padding: 5px;    width: calc(100% - #{$paddding * 2});}

OK,解决!

郑重声明:本文版权包含图片归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们(delete@yzlfxy.com)修改或删除,多谢。

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

留言与评论(共有 0 条评论)
昵称:
匿名发表
   
验证码: