问题：less 中的 calc 计算异常，结果为何变成固定百分比？
在进行 CSS 样式开发时，使用 Less 预处理器遇到一个问题。在一个正式环境和测试环境中使用了以下 Less 代码：
.element { width: calc((100% - 40px) / 4);}
然而，在测试环境中，calc 计算后的值意外地变成了固定的 15%。
解答：
在 Less 中，涉及不同单位混合运算的 calc 表达式会遇到一个特殊情况。具体来说，在 Less 中，calc(100% – 40px) 这样的带有单位混合的运算会被 Less 解析忽略单位，全部按照百分比计算。因此，上述表达式的计算被解析为 calc(60% / 4) = calc(15%)。
要解决此问题，有两种正确的方法：
使用单位符号：
.element {width: calc((~"100% - 40px") / 4);}
定义变量并使用变量：
@myHeight: 30px;.element {width: calc((~"100% - @{myHeight}") / 4);}
通过以上方法，可以确保 Less 正确解析单位，并获得预期的计算结果。
以上就是Less 中的 Calc 计算为何变成固定百分比？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1558395.html
微信扫一扫 
支付宝扫一扫 
