为什么在方程中使用 0 时 css-calc() 不起作用？
Why doesn't css-calc() work when using 0 inside the equation?
我正在使用 calc() 在 class 中设置 top: 属性。我需要一些帮助来理解 calc() 是如何使用的——我认为两个方程式应该有相同的结果，但事实并非如此。 （上面的等式不实用，我只是想调试一个更大的问题并注意到这两个没有相同的结果）
calc(-10px + ((1 - 1) * 0));
calc(-10px);
第一个等式无效，因为它会导致 calc(-10px + 0)
Note: Because <number-token>s are always interpreted as <number>s or <integer>s, "unitless 0" <length>s aren’t supported in calc(). That is, width: calc(0 + 5px); is invalid, even though both width: 0; and width: 5px; are valid. ref
如果结果不为零，您将陷入此境：
At + or -, check that both sides have the same type, or that one side is a <number> and the other is an <integer>. If both sides are the same type, resolve to that type. If one side is a <number> and the other is an <integer>, resolve to <number>.
最后一个更合乎逻辑，因为 10px + 5 没有意义，我们可能会认为 10px + 0 只是 10px，但对于浏览器而言并非如此。
我正在使用 calc() 在 class 中设置 top: 属性。我需要一些帮助来理解 calc() 是如何使用的——我认为两个方程式应该有相同的结果，但事实并非如此。 （上面的等式不实用，我只是想调试一个更大的问题并注意到这两个没有相同的结果）
calc(-10px + ((1 - 1) * 0));
calc(-10px);
第一个等式无效，因为它会导致 calc(-10px + 0)
Note: Because
<number-token>s are always interpreted as<number>s or<integer>s, "unitless 0"<length>s aren’t supported incalc(). That is, width:calc(0 + 5px);is invalid, even though both width: 0; and width: 5px; are valid. ref
如果结果不为零，您将陷入此境：
At + or -, check that both sides have the same type, or that one side is a
<number>and the other is an<integer>. If both sides are the same type, resolve to that type. If one side is a<number>and the other is an<integer>, resolve to<number>.
最后一个更合乎逻辑，因为 10px + 5 没有意义，我们可能会认为 10px + 0 只是 10px，但对于浏览器而言并非如此。