在某些情况下，为了更好的适配浏览器，我们会在css里面用上calc方法来准确的计算出元素的高度或宽带等属性。
例如：
需求：让页面内容刚好填充一屏幕高度。
页面内容分为2部分，已知头部导航栏为80px，此时我们只需要拿到屏幕高度 - 导航栏高度（80px），等到的像素就是内容区域的高度了，css我们这样写就可以了
.body { height: calc(100vh-80px) }
但如果你使用了less，你会发现，这里的高度并不如我们所愿，此时高度会奇怪的变成了 20vh。那是因为 less 中本来有 - 运算操作，我们 calc 中加上 ~'' 就可以 阻止被 less 编译（来自网友的解释）。
.body { height: calc(~"100vh - 80px") }
这样一来，我们就可以得到正确的结果了。