css - br line-height in safari 和 chrome 留空

Question

在我的 HTML 中我有一个 <div> ，并在 <div> 内我需要不同的文本行之间的垂直间距。我通过使用 <br /> 实现了这一点具有对应于我想要的间距量的 CSS 类的元素。

例如，对于 5px 的间隙，我使用 <br>与 height5类:

<br /><br class="height5" />

同样，height2和 height10以及出于相同目的而存在的任何东西。

CSS 类定义如下:

br.height2 {line-height:2px;}
br.height5 {line-height:5px;}

这在 IE6+、FF2+ 和 Opera 中有效，但由于某些原因，Safari 和 Chrome 中存在巨大差距(就好像这两个浏览器忽略它并且只是应用常规中断)。我尝试使用更大的行高(例如 20px 或 30px)进行测试，Safari 和 Chrome 可以识别这些。他们似乎忽略了 5-10 像素以下的任何内容。

帮助？谢谢!

Answer 1

这在 Chrome 上有效(content 属性起到了作用):

br {
  content: " ";
  display: block;
  margin: 1em;
}