为啥使用“第一个可用字体”定义 CSS 'ex' 单元？

Posted 2023-02-21

【中文标题】为啥使用“第一个可用字体”定义 CSS \'ex\' 单元？

【英文标题】：Why is CSS 'ex' unit defined using the 'first available font'?为什么使用“第一个可用字体”定义 CSS 'ex' 单元？

【发布时间】：2022-01-09 18:05:19

【问题描述】：

为什么em单元是根据实际用于渲染文本的字体来定义的，而ex单元使用第一个可用字体?

在我看来，用于计算 ex 高度的字体可能与实际用于呈现文本的字体不同。

引用规格：

第一个可用字体，例如在定义字体相关长度（如“ex”和“ch”）或定义“line-height”属性时，被定义为第一个可用字体，将匹配 'font-family' 列表中给定字体系列的 U+0020（空格）字符（或用户代理的默认字体，如果没有可用的字体）。

算法为什么要寻找空间来计算字母“x”的高度？非常感谢外行的解释。

【问题讨论】：

我的猜测是防止在加载不同字体时发生重新布局。这样，您的页面就不会跳动？

没想到这个，谢谢你的评论。

【参考方案1】：

为什么 em 单位是根据实际用于渲染文本的字体定义的，而 ex 单位使用第一个可用的字体？

这不应该是这样：两个单位都是相对于当前字体的。您提供的定义中提到了“font-relative lengths 例如‘ex’”，其中还包括‘em’单位。

也就是说，作者似乎同意应该澄清“第一个可用字体”的定义：https://github.com/w3c/csswg-drafts/issues/4796

您引用的部分似乎暗示如果font-family 列表中的第一个字体存在，但U+0020（空格）字符不在该字体中，则应使用下一个字体。实际上，听起来浏览器并没有这样做，这可能不是最初的意图。

您可以在此处查看对定义所做的更改，如该问题中所述：https://github.com/w3c/csswg-drafts/commit/7c2108c1764f328e0b60fffed47d3885a3dc7c11?diff=split

算法为什么要寻找空间来计算字母“x”的高度？非常感谢外行的解释。

出于收集和计算字体度量的目的，U+0020 空间很可能是最早和最常见的代码点，它可以包含该信息并且需要检查。然后计算许多指标，例如行高和 em 单位，而不仅仅是 ex 单位。

除此之外，CSS ex unit section 提供了有关如何确定该值的更多详细信息：

x-height 之所以这么叫，是因为它通常等于小写“x”的高度。但是，即使对于不包含“x”的字体，也会定义 ex。可以通过不同方式找到字体的 x 高度。一些字体包含可靠的 x 高度指标。如果可靠的字体度量不可用，UA 可能会根据小写字形的高度来确定 x 高度。一种可能的启发式方法是查看小写“o”的字形在基线下方延伸多远，然后从其边界框的顶部减去该值。在无法确定 x 高度或无法确定 x 高度的情况下，必须假定值为 0.5em。

【讨论】：

信息量很大；谢谢你的回答。