LESS中calc()函数单位混合运算问题：为什么100% - 40px / 4 = 15%？

LESS中calc()函数单位混合运算问题探讨

在使用LESS开发时，可能会遇到calc()函数中单位混合运算计算结果与预期不符的情况。

如问题中所述，表达式calc((100% - 40px) / 4)在实际环境中计算正常，而在测试环境中却返回calc(15%)。

这个问题的根源在于LESS解析机制。在带单位的混合运算中，LESS会忽略单位，将所有值按百分比计算。因此，上面的表达式被解析为calc(60%/4)=calc(15%)。

解决此问题的两种方法：

1. 使用单位符号包裹表达式：calc((~"100% - 40px") / 4)。
2. 定义变量存储单位值，并将其作为百分比参与计算：@myHeight: 30px; calc((~"100% - @{myHeight}") / 4)。

这样，LESS就可以正确识别单位，确保计算结果符合预期。

以上就是LESS中calc()函数单位混合运算问题：为什么100% - 40px / 4 = 15%？的详细内容，更多请关注其它相关文章！