HTML，CSS和垂直文本边距

如何解决HTML，CSS和垂直文本边距

| 这可能是基本内容，因此，如果有关于html文本和页边距工作方式的在线参考，请给我一个链接。 无论如何，我在定义文本的确切边距时遇到了一些麻烦。下面是一个图像示例，一个div包含下面的文本，并且div下方包含更多文本。其他边距设置为0，并且div的边距是顶部和底部分别为10px，左侧和右侧为0。由于我不知道的原因，结果显示顶部16像素，底部14像素。我可以用边距定义补偿错误，但实际上我想知道发生了什么，而不是处理症状。

<img src=\"images/temp/img.png\" />
<div><p>Testing</p></div>
<h2>Siirry</h2>

div的样式是

div {
    color:#f00;
    text-transform:uppercase;
    font-size:9px;
    line-height:9px;
    height:9px;
    margin:10px 0;
    overflow:hidden;
}

示例图片： 编辑： 由于我的观点显然并不清楚，因此可以得到更多信息： 根据Firebug之类的工具，边距为10px。那不是我要的。但是，由于字体的呈现方式，文本框实际上大于文本的实际大小。这将导致VISUAL边距大于定义的边距（您可以通过在Photoshop或类似软件中对其进行测量来验证）。我正在寻找有关文本框大小和实际大小之间关系的信息，因此我可以正确定义边距。     

解决方法

        那是因为字体没有使用整个高度。更好的指示（尽管可能并不完美）是选择文本并检查黑色边框和突出显示的矩形之间的边距。这也适用于\'testing \'下面的文本。它将占据这14px的一部分。     ,        我无法重现您的问题。您能否使用http://jsfiddle.net/重新创建有问题的情况并与我们分享？ 但是，您的CSS存在问题。您不应该在div上指定9px的高度（由于空白，它的高度至少为20px）。指定行高与字体大小无关，而与两行文本之间的间距无关（不是您的情况）。 最后一件事：您用什么来测量边距（16和14像素）？图像编辑器？您应该使用Firebug或chrome开发者工具之类的工具。     ,        对我来说很好 在这里，我添加了一些背景，以便您可以看到盒子的位置：http://jsfiddle.net/Eric/fcHZN/3/ 各个框之间肯定有10像素的间距。看起来您的多余空格来自图片或

Siirry

文本，而我们都不提供CSS。