我有一大段的文本,分为<br>的子段落:

<p>
  Blah blah blah.
  <br/>
  Blah blah blah. Blah blah blah. Blah blah blah.
  <br/>
  Blah blah blah.
</p>

我想扩大这些分段之间的间隔,比如有两个<br>之类的。我知道这样做的正确方法是使用<p></p>,但现在我不能改变这个布局,所以我正在寻找css的解决方案。

我试着用display: block设置<br>的行高和高度,我也谷歌了一下,堆栈溢出了,但没有找到任何解决方案。在不改变布局的情况下,这可能吗?


当前回答

迈克尔和尤达都是对的。你能做的是使用<p>标签,它是一个块标签,使用底部边距来抵消下面的块,所以你可以做类似的事情来获得更大的间距:

<p>
    A block of text.
</p>
<p>
    Another block
</p>

另一种替代方法是使用block <hr>标记,使用该标记可以显式地定义间距的高度。

其他回答

可能会发现一个解决方案非常简单,你只需要创建不同类型的。似乎对我有用。

例子: (html代码)

<br/ class="150%space">

(css代码)

br[class='150%space']
{
   line-height: 150%;
}

当我无法从span标签中获得样式间距时,这为我做了一件事:

        <p style='margin-bottom: 5px' >
            <span>I Agree</span>
        </p>
        <span>I Don't Agree</span>

如果有人已经说过了,我很抱歉,但简单的解决方法是玩转你的“行高”。如果你在使用换行符时占用了太多的空间,这只是因为你把行高设置得太高了。你可以在CSS中纠正这个错误(但知道这会影响所有使用该属性的东西),或者你可以使用内联样式来覆盖CSS。

有趣的是,如果将break标记写成完整形式,如下所示:

<br></br>

那么CSS行高:145%就可以了。 如果break标记写为:

<br> or 
<br/> 

那么它就不能工作了,至少在Chrome、IE和firefox中是这样。 奇怪!

另一种方法是使用人力资源。但是,狡猾的是,让它隐形。

因此:

<hr style="height:30pt; visibility:hidden;" />

使用HR来模拟一个更干净的BR中断:Btw适用于所有浏览器!!

{ height:2px; visibility:hidden; margin-bottom:-1px; }