alignment - 行高和对齐的问题

Question

我有一个元素，它可能比一行长，所以我必须设置一个 line-height>1 否则它看起来很糟糕。但如果我这样做，线条会高于文本，并且文本会居中。所以它与顶部不匹配。我怎样才能将文本的位置更改到行的顶部，或者是否有另一种方法可以在两行之间留出一些空间？

Answer 1

根据定义，行高使字体大小在给定的行高内居中。如果您有 12px 的字体和 16px 的行高，文本将在 16px 内居中，在顶部和底部留下 2px。

在保持行高的同时将文本向上推的一种解决方案是向元素添加负边距并将其负向向上推:

float: left;
margin-top: -2px;