一个只包含文本的span元素高度是由文本的content-area撑开的吗?

看过一些资料,了解了一些关于行内盒子的概念。就想测试一下能不能表现出文本的content-area。
目前发现span元素如果只包含文本的话,高度和content-area的高度很相似。但是又存在一些疑惑。
以下代码是基于simsum字体的font-size = content-area来实现的。这个是在视频中看到的。因为我也不懂字体设计,没办法去验证。如果这个条件成立的话,请看这个代码。

<!DOCTYPE html>
<html>
<head>
    <title>测试line-height决定行框盒子的高度</title>
    <meta charset="utf-8">
    <style type="text/css">
        .text{
            font-family: 宋体;
            font-size: 20px;
            line-height: 0px;
        }
    </style>
</head>
<body>
    <span class="text">一个只包含文本的span元素,其高度是由文本的内容区高度撑开的吗</span>
</body>
</html>

在chrome中,span元素的高度就是20px。正好等于font-size。
但是在firefox中,span元素的高度是21.33333px。仿佛又不对。

初学者诚信求各位指点一下,在此谢过。

阅读 2.8k
1 个回答

我用 FontForge 看了下是chrome显示的正确,firefox为什么会大1px就不懂了

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题