解决在sass中使用calc不能包含变量的问题。

时间：2017-10-15 10:44:52 阅读：2310 评论：0 收藏：0 [点我收藏+]

今天写sass的时候，发现在sass中使用calc，如果calc中包含一个变量，不会产生效果，看代码：

.app-inner {
    display: flex;
    height: calc(100% - $topbar-height);
}

在浏览器中没有产生效果：

技术分享

可以看到sass并没有解析这个$topbar-height。

最后在github的issue中找到了方法，要想在sass的calc中使用变量，必须对这个变量使用sass的插值方法(#{$variable})。

所以把代码改正下面的形式就可以了：

.app-inner {
    display: flex;
    height: calc(100% - #{$topbar-height});
}

在浏览器中可以看到这个变量被解析了：

技术分享

原文：http://www.cnblogs.com/zhiyingzhou/p/7669132.html

踩

(0)

(1)

评论一句话评论（0）

分享档案

更多>