scss 使用 calc 遇到的问题

今天写代码时,需要对一个scss变量做calc处理,发现直接使用变量,浏览器是无法识别的,后面查了一下,要对变量处理才能正常使用

1
2
3
4
5
$a: 20px;
.xxx {
width: calc(100% - $a); // 这样写是不行的
height: calc(100% - #{a}); // 要这样写才生效
}