~ in calc() calculation attribute means to prevent compilation by less syntax

Posted Jun 16, 20201 min read

calc can be used directly in css.

I feel that the subject is talking about the syntax of less, because less originally had-arithmetic operations, so adding `~" "in calc prevents compilation by less.

For example in css


The representative is 100%height minus 30 pixels.

But if this is also written in less, when less is compiled into css, it will become


Because less itself has the operation of ‘subtract’, it violates the original intention, so in less, it should be written as: