美文网首页
css3中calc在less编译时被计算的解决办法

css3中calc在less编译时被计算的解决办法

作者: 放任自由f0 | 来源:发表于2019-07-12 14:15 被阅读0次

css中写法
div {width : calc(100% - 30px);}
less中 由于less的计算方式跟calc方法有重叠,两者在一起有冲突
div {width : calc(~"100% - 30px");}
用变量的写法
div {
  @diff : 30px;
  width : calc(~"100% - @{diff}");
}

变量的用法
@urls: 'https://*****.com'; // 变量地址
.item-city{
background:url('@{urls}/logo.png');
}

相关文章

  • css3中calc在less编译时被计算的解决办法

    css中写法div {width : calc(100% - 30px);}less中 由于less的计算方式跟c...

  • calc计算属性的用法

    calc是CSS3中新增的计算属性。 普通的CSS样式时,计算属性的写法如下: Less中,计算属性的写法如下: ...

  • Gulp-less编译calc

    最近用gulp-less编译less文件,在用calc计算方法时,css的计算方法和less冲突,导致运算错误,试...

  • 解决less打包后calc计算错误的问题

    在使用less预处理器处理样式时,用到calc计算属性,如下calc(100% - 44px); 编译后,浏览器查...

  • calc使用

    1. calc基本使用 calc在css3中用于动态计算长度值,calc()中接受数学四则运算,运算的结果为计算后...

  • CSS3之calc()

    一、calc()是什么 calc是英文单词calculate(计算)的缩写,是css3新增的功能,calc() 函...

  • less下calc混合单位运算

    问题 在less中,使用calc(100% - 7px)或者calc(100% - 7rem)的结果都是calc(...

  • css3 calc()

    什么是calc() calc是英文单词calculate(计算)的缩写,calc()是css3的一个新增的功能,用...

  • css栅格化布局

    参考资料:淘宝UED栅格化模式研究 Bootstrap官网栅格化介绍CSS3中calc的使用LESS的使用栅格化...

  • 30秒 学懂 css(二)

    计算属性calc() 函数calc()支持CSS3; 让你的CSS具有计算功能, CSS属性值就是表达式的结果 h...

网友评论

      本文标题:css3中calc在less编译时被计算的解决办法

      本文链接:https://www.haomeiwen.com/subject/wrvekctx.html