div和文本之间的这个神秘差距是什么？

Question

添加文字时，我在DIV的顶部和底部之间存在较大差距时遇到了一些麻烦。它看起来像文本的计算高度，但为什么它出来这么多？理想情况下，我需要它尽可能与边界齐平。

我已经创建了一个简单的小提示来演示这个http://jsfiddle.net/XFqq5/3/

CSS

#text {
 display: inline-block;
 font-size: 70px;
 border: 1px solid red;
 line-height: 1;
}

HTML

<div id="text">test</div>

Answer 1

这是以下各项的组合：

• 您没有使用字体中最高或最低的字形（键入大写字母和带有下划线的字形，例如g或y）和
• 没有规则说明字形必须拉伸字体的整个高度