了解 CSS 字母间距：将 normal 的默认值替换为 0 是否有效？

Question

根据 this page，CSS 字母间距 属性的默认值为 normal.

值得注意的是，非默认值被添加到默认值：

The most important point to note when using letter-spacing is that the value specified does not change the default, it is added to the default spacing the browser applies (based on the font metrics). letter-spacing also supports negative values, which will tighten the appearance of text, rather than loosening it.

根据这个定义，0 应该等同于默认值 normal 因为 0 + X = X.

1) 用0代替默认值normal是否有效？（这是针对滑块实现的。）

2) 为什么 0 不是默认值？为什么引入另一个值（即 normal）？

This test on CodePen 也表明 0 的值确实等同于默认值 normal.

.loose {
  letter-spacing: 2px;
}

.tight {
  letter-spacing: -1px;
}

.zero {
  letter-spacing: 0;
}

.normal {
  letter-spacing: normal;
}

<p>This type has no additional letter-spacing applied.</p>

<p class="loose">This type is letter-spaced loosely at <code>2px</code>.</p>

<p class="tight">This type is letter-spaced tightly at <code>-1px</code></p>

<p class="zero">This type is letter-spaced at <code>0</code></p>

<p class="normal">This type is letter-spaced at <code>normal</code></p>

Answer 1

根据 Mozzila 文档：https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing#Values

The normal letter spacing for the current font. Unlike a value of 0, this keyword allows the user agent to alter the space between characters in order to justify text.

似乎 0 更难设置为默认值。 Normal 可以被用户代理修改。

Answer 2

不，两者完全不等同。如果你勾选 the current specification

normal

The spacing is the normal spacing for the current font. This value allows the user agent to alter the space between characters in order to justify text.

然后

<length>

This value indicates inter-character space in addition to the default space between characters. Values may be negative, but there may be implementation-specific limits. User agents may not further increase or decrease the inter-character space in order to justify text.

在大多数情况下，它们会呈现相同的内容，但如您所见，用户代理不会对两者进行相同的处理。

the Draft of the next level中的定义似乎略有变化，现在两者相同。

For legacy reasons, a computed letter-spacing of zero yields a resolved value (getComputedStyle() return value) of normal..

您也可以在这里阅读：https://github.com/w3c/csswg-drafts/issues/1484

CSS2 used to treat normal different than 0, so computing differently was a requirement. Now that the spec treats them the same ...

我不知道是否所有浏览器都已经实现了这个级别，但您很可能认为它们是一样的

了解 CSS 字母间距：将 normal 的默认值替换为 0 是否有效？

Understanding CSS letter-spacing: is it valid to replace the default value of normal with 0?

html

css

letter-spacing