css - 为什么 + 或 - 必须在 Calc() 方法中用空格包围？

Question

最近我开始在 CSS 中使用 calc(...) 方法。我很快了解到，诸如 width: calc(100%-2) 之类的代码将不起作用，尽管在 - 运算符前后添加空格可以解决问题并且 calc 方法将正常运行。

在做了一些研究之后，我发现多篇博客文章都提到了空格是必需的，许多人甚至指出了规范 (CSS3 8.1.1)，其中指出:

In addition, whitespace is required on both sides of the + and - operators. (The * and / operaters can be used without whitespace around them.)

现在，很明显，规范告诉我们这些运算符必须用空格包裹，但为什么呢？我已经在规范中进一步阅读(通过第 8.1.2-4 节)，如果在这些附加部分中有解释，我不理解其中的原因。

简单来说，有人可以解释为什么指定 calc(100% - 1) 甚至 calc(100%/2) 是可接受的语法但不是计算(100%-1)?

Answer 1

- 字符是 CSS 标识中允许的字符之一。从给出的决议来看 here ，他们似乎想防止使用 - 时不带空格可能引起的句法歧义，尤其是使用诸如 min-content 之类的关键字值时(尽管 AFAIK 关键字值尚未允许在 calc() 中使用——如果我错了请纠正我)。

Not everyone agrees不过，有了这个决议。