因此，行内文本元素的实际高度不仅仅是font-size值，而是由单个字体的度量确定的，如this answer中所解释的（另请参见this article）。
因此，对于font I'm using，上升是96.7%，下降是28.3%，导致总内容面积为125%。
这意味着对于15 px的基本字体大小，实际元素的高度应该是18.75px。浏览器将其舍入为19 px。我可以接受。
当你改变自己的时候，你就改变了自己，改变了自己。此表显示了Chrome开发工具报告的虚拟CSS像素高度：
| 变焦|高度|
| --|--|
| 百分之五十|18px|
| 百分之六十七| 19.5px |
| 百分之七十五| 18.67px |
| 百分之八十| 18.75px |
| 百分之九十| 18.89px |
| 百分百|19px|
| 百分之一百一十| 19.09px |
| 百分之一百二十五| 18.4px |
| 百分之一百五十| 18.67px |
| 百分之一百七十五| 18.29px |
| 百分之二百| 18.5px |
| 百分之二百五十| 18.8px |
| 百分之三百|19px|
| 400%| 18.75%|
| 500%| 18.8px |
这是一个相当广泛的价值观，并使试图调整事情变得困难。我尝试应用padding来填充background-color到整个line-height，如this answer中所解释的，当计算的元素高度改变但padding值不变时，它不可靠地工作。
关于问题（S）：
1.如何计算这些实际的图元高度值？
1.奖励问题：有没有办法使它在所有缩放级别上保持一致？
1条答案
按热度按时间8fsztsew1#
部分答案：
Chrome似乎总是将内联文本元素的高度设置为真实的设备像素的整数值，然后将理想高度18.75乘以缩放。例如，对于125%，它是18.75 * 1.25 = 23.4375。这被四舍五入到23个真实的像素。开发工具（可能还有其他浏览器测量功能）报告真实的像素除以缩放：23 / 1.25 = 18.4，这就是我的表格所显示的。
但这并不适用于175%...
不幸的是，我还没有找到一种方法来调整填充相应的数额。我想我将不得不返回到设置
display: inline-block，但是如果任何span比一行长，那么就会引起麻烦，所以我想我将不得不将span分解为单词...