CSS显示：块问题

Question

我们有下面的代码： http://jsfiddle.net/DVwmJ/

正如你所看到的，绿线是红线（我们并不指望这一点）后4PX。 任何人都知道为什么如果我取消注释跨显示元素的“display：block”css声明行重叠（如预期）？

预先感谢

Answer 1

没有display: block，所述span仍然是一个内嵌元素。多余的4个像素的高度来自用于字母descenders的空间。一个观察：如果你改变font-size，the amount of extra height also changes。

如果您不想指定display: block,you could set vertical-align: top，这与默认的vertical-align: baseline不同。