Html 以像素为单位设置CSS字体大小时，该值是否表示字母的宽度或高度？

字体大小的像素值是指字体的高度还是宽度

CSS:

HTML:

a

“a”是16像素高还是16像素宽，或者两者都是最大宽度/高度，这样整个字符就可以放在一个16px的框中

---

我所看到的关于这一点的所有文件在这个问题上都是模棱两可的。

高度——特别是从上升器顶部（例如“h”或“l”（el））到下降器底部（例如“g”或“y”）的高度。请参阅有关类型剖析的有趣文章。

无论使用何种单位，

font-size

属性指定字体大小。字体的大小可以用字体的高度来表示，但即使这样，也只是一种松散而实用的描述；字符可以扩展到字体大小定义的级别之上或之下。大小或多或少是一个抽象属性，不应期望它与任何字符的高度（更不用说宽度）相对应

特别是，如果设计一种字母“a”占据整个字体高度的字体，那将是完全错误的。“a”的高度通常约为字体大小的一半，但这肯定会因字体而异（试着在《泰晤士报新罗马》和《Verdana》中用“a”测试，使用相同的字体大小）。

根据，字体大小实际上与字符的实际高度无关。它甚至不是包含文本的内联元素的高度

当然，

font-size

属性的值越大，文本越大。但是像素值不能直接转换为文本的实际大小

---

但是，

font size

的像素值设置了

1em

的大小，用于设置边距、填充等。

我认为这根本不正确。字体大小中包含升序和降序-如果说字符延伸到字体大小的上方和下方，则会产生误导。你是不是在考虑x高？x-height是从基线到非圆字符（如“x”）顶部的高度。升序和降序超出字体的x高度，但很少有人会将x高度称为与字体大小相同。另外，字体大小在大多数圆圈（包括HTML渲染）中并没有松散的定义。我并没有混淆字体大小和x高度。从上升管顶部到下降管底部的距离只是一个粗略的描述，而不是一个规范。通常情况下，字体使用的高度略低，有时使用的高度更高。演示代码：QÅgjþÊ

。css2.1规范说：“字体大小对应于em正方形，这是排版中使用的一个概念。请注意，某些字形可能会溢出em正方形。”

.sixteen {
  font-size: 16px;
}

<span class='sixteen'>a</span>