[分享]css两行文字距离

使用CSS设置两行文字之间的距离是一个常见的问题。在大多数情况下，我们可以使用线高来为文本创建间距。 CSS中的行高是指行框的高度，可以用像素、百分比、em或任何其他长度单位来设置。它不仅影响行内元素...

使用CSS设置两行文字之间的距离是一个常见的问题。在大多数情况下，我们可以使用线高来为文本创建间距。
CSS中的行高是指行框的高度，可以用像素、百分比、em或任何其他长度单位来设置。它不仅影响行内元素的间距，也影响其周围的空间。
例如，假设我们有一个p标签，其包含两行文本。我们可以使用下面的CSS代码来设置行高：
pre { font-family: 'Courier New', Courier, monospace; font-size: 14px; line-height: 1.5; }
在这个例子中，我们设置了Courier New字体，字号为14px，并将线高设置为1.5。这意味着每个行框的高度为文本大小（14px）的1.5倍。因此，两行文本之间会有一些空白。
我们也可以将线高设置为固定像素大小。例如，如果我们想让两行文本之间有10像素的间距，可以像这样设置CSS：
pre { font-family: 'Courier New', Courier, monospace; font-size: 14px; line-height: 24px; }
请注意，这个例子中的字体大小仍然是14px。然而，线高设置为24px，因此每个行框的高度为24px，即文本大小和10像素之和。
总之，线高是调整两行文本之间间距的常用CSS属性。它可以使用像素、百分比、em或任何其他长度单位来设置。通过调整线高，我们可以为文本添加或减少间距。