在设计界面样式的时候,在less
文件中使用了css
的calc
运算,但是发现得到的结果并不理想
#less
width: calc(100% - 40px);
理论上想得到的结果是:宽100%减去40个像素,实际计算得到的结果是:60%宽度
出错原因:
less自带的-
运算符不会计算两个单位不同的公式,会默认将后面的单位转换成第一个被减元素的单位,所以就变成了100% - 40%
得到的结果是 60%
解决办法:
-
~
转移运算符,阻止被 less 编译
width: calc(~"100% - 40px");
- less 内置函数e()
width: e("calc(100% - 40px)")