如何防止行高在顶部添加边距？

Question

每当我使用像line-height这样的大1.6em时，它总是会在文本的最顶部添加一个我不想要的边距。

示例：http://jsfiddle.net/EstpJ/1/

我希望文字与边框一致，并且没有任何顶部或底部边缘。

如何解决这个问题？

Answer 1

这正是line-height的内容，它是一种手动方式来设置文本行的高度，以便包装文本等。实际可见大小由font-size确定，并由font-family确定。普通文本/字体的平均line-height大约为1.2em。任何大于此的东西都会导致可见letterboxing，这正是您所描述的。使用较小的值将导致连续的线相互重叠。

修复确切示例的唯一方法是引入更多标记来确定行号，以便您可以以不同方式设置第一行/最后一行的样式。

Answer 2

你可能会略微改变你的标记（我更喜欢在文本行周围包裹<p>标签）并使用negative top margin？

Answer 3

正如马修所说，这就是线路高度所做的。

您可以尝试在内部div（在带边框的内部div）内设置线条高度，并通过设置负顶部和底部边距来抵消顶部和底部效果。但是负面边际可能不适用于所有浏览器。