运行calc(100% - 60px) 等于40%

错误原因:
在less中 calc(100% -60px) 等带单位混合运算会被less解析忽略单位,全部按照百分比计算,此例中的计算被less编译成calc(40%)
写法:

div{
  width: calc(~"100% - 30px");
}
//less中使用calc写法
@myHeight: 30px;
div{
  height: calc(~"100% - @{myHeight}");
}
//less中变量写法
//或者
div{
  width: ~"calc(100% - 30px)";
}
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 本文主要讲述页面布局样式方面涉及的知识点,更全面的对CSS相应的技术进行归类、整理、说明,没有特别详细的技术要点说...
    Joel_zh阅读 4,704评论 0 1
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,375评论 1 45
  • 摘自http://www.w3cplus.com/css3/how-to-use-css3-calc-functi...
    Lareina林暖暖阅读 4,097评论 0 0
  • 尽量减少代码重复 在软件开发中,保持代码的DRY 和可维护性是最大的挑战之一,而这句话对CSS 也是适用的。在实践...
    图灵教育阅读 4,935评论 0 14
  • 记一只小白的分享 欢迎访问'’me''的csdn博客园:https://blog.csdn.net/weixin_...
    静默思想阅读 3,968评论 0 0

友情链接更多精彩内容