没有标签包裹的文本，这个高度怎么来的？

顺晟科技

2021-07-09 11:25:08

300

行内盒子的内容区的高度与字体和字号有关

行内盒子高度却是由line-height的计算值决定的

即使行内盒子的内容区高度大于line-height的计算值

行内级盒子的高度更像是一个逻辑的概念，用来帮助确定行盒（Line box）的高度。

我本来写个dmeo来计算div中一行行盒中不同对齐div方式后的div高度

<body>
    <div style="background-color: aqua;">
       26px怎么来的
       <span style="background-color: pink;">1.32 x 16px = 21.12</span>
    </div>
</body>

谷歌默认设置微软雅黑字体，大小为16px

微软雅黑字体的ascender和descender之和为2703，em-square为2048...

span的内容区高度为 16px * 2703 / 2048 = 21.12px

至于浏览器渲染为20.8我也没查到为什么会这样，知乎上倒是有测试谷歌这种情况，但原因没讲

但是重点是

没有标签包裹的文本为何渲染为26px?

它应该继承父元素的font-size值啊

哎，不懂的地方太多，就这，一两个小时过去了。。。

不吝赐教，顿首！

并没有出现26的情况

上一篇：html 元素为什么能被实时修改？下一篇：鼠标选中的真的是行内盒的内容区吗？这

网站建设

Html

没有标签包裹的文本，这个高度怎么来的？