如何调整 CSS 中每个 的两行之间的间距？答案

【问题标题】：How to adjust the amount of space between two lines at each in CSS?如何调整 CSS 中每个 的两行之间的间距？
【发布时间】：2014-10-31 05:39:14
【问题描述】：

我有这样的文件：

This is some text.<br>
This is some more text.<br>
This is yet some more text.

呈现如下：

This is some text.
This is some more text.
This is yet some more text.

有什么方法可以调整行间距，但仅限于出现  的地方？输出可能如下所示：

This is some text.

This is some more text.

This is yet some more text.

这与双倍空格不同，因为在页面上换行的长行不会与多余的空格一起出现。

如何调整出现  的行之间的间距？

【问题讨论】：

您可以专门在br 标签上使用line-height，例如here。需要检查它是否适用于所有浏览器。
How to change the height of a ?的可能重复
我用你的确切标题搜索了这个问题，第一个结果是显示为可能重复的问题。

标签： html css

【解决方案1】：

可以使用 CSS 定位   标记，但它不会很好地跨浏览器兼容，而且这不是一个好主意，因为任何查看您的代码的人都会认为您没有最微弱的知道你在做什么，因为肯定有更合适的方法来实现你的目标。

br {}

  本身没有默认高度。如果您的 HTML 页面只包含  ，则您有一个空白页面。   标签上的样式将是

<!-- HTML -->
<br/>

页面将具有这种样式

height: auto;
line-height: normal;
max-height: none;
min-height: 0px;

  标签所代表的高度继承自其父容器的样式。因此，如果它嵌套在一个段落中；   将根据该段落的 line-height 和 font-size 等于 1 行文本的高度。

<!-- HTML -->
<p style="font-size:10px;line-height:1;"><br/></p>

我现在有一个空页面，但页面高 10 像素，因为我指定段落应该是 10 像素，即使段落本质上是空的，它也不是空的，因为我有一个休息时间。因此，break 相当于 1 行文本的高度。

当前的 CSS1 属性和值无法描述 “BR”元素。在 HTML 中，“BR”元素指定换行符词之间。实际上，该元素被换行符替换。 CSS 的未来版本可能会处理添加和替换的内容，但是基于 CSS1 的格式化程序必须特别对待“BR”。 - Cascading Style Sheets, Level 1, Section 4.6: 'BR' elements

适当的解决方案是将上下块分成两个容器 ()，并在两个块之间设置一个边距。如果您使用 标签，您可以设置段落之间的空间，而无需像这样在顶部段落中添加不需要的空间..

// CSS
p + p { margin-top:10px } // for every paragraph that's preceeded by a paragraph add a margin of 10pixels above. this gets every paragraph except the first one.

如果你不介意每行之间的间距也增加，或者只是调整文本的行高

您可能还会发现伪选择器 ::first-line 很有用。

虽然我无法理解为什么；我确实相信这样一个事实，有时总有一个很好的理由来打破规则.. 如果你绝对确定  的样式，请将其包装在一个容器中并设置容器的行高。

<div style="line-height:50px;"><br></div>

【讨论】：

【解决方案2】：

是的，你可以...喜欢在 css 中使用 line-height

.test{
    line-height:40px;
}

Demo

你也可以使用padding-top

Demo2

【讨论】：