Calc()如何在css中计算？

Question

有人可以用Calc()css 描述使用吗？什么是~标志意义Calc()？

以下代码如何计算？

calc(~'(100% - 4 * 23.233%) / 3')

Answer 1

这不是普通CSS中的有效值.

看起来这是来自LESS源代码,它被编译为以下内容:

calc((100% - 4 * 23.233%) / 3);

如相关的LESS文档所述,~''用于转义:

转义允许您使用任意字符串作为属性或变量值.内部的任何内容~"anything"或~'anything'按原样使用,除了插值外没有任何变化.

这样做是为了防止LESS自动将表达式计算为数学.如果没有转义,则将评估该值并将其编译为:

calc(2.3559999999999994%);

有关进一步参考,请参阅此相关问题:" 使用CSS3 calc进行较少的积极编译 ".