首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >LESS中加‘~’符号的区别

LESS中加‘~’符号的区别

作者头像
德顺
发布于 2022-04-09 14:47:00
发布于 2022-04-09 14:47:00
2.5K0
举报
文章被收录于专栏:前端资源前端资源

在 *.less 文件中写:

代码语言:javascript
复制
.test {
  width: calc(300px - 20px);
}

在相应的 *.css 文件中的结果是这样的:

代码语言:javascript
复制
.test {
  width: calc(280px);
}

这里的 calc(300px - 20px) 由编译软件计算得出。

在 *.less 文件中写(加上 ~):

代码语言:javascript
复制
.test {
  width: ~ 'calc(300px - 20px)';
}

在相应的 *.css 文件中的结果是这样的:

代码语言:javascript
复制
.test {
  width: calc(300px - 20px);
}

这里的 calc(300px - 20px) 由浏览器计算。

未经允许不得转载:w3h5 » LESS中加‘~’符号的区别

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档