HTML:空<p> </ p>标记显示没有换行符

Question

我们有一个.NET应用程序在axml中保存消息.我们需要做的是将其转换为html.我发现第三方库"HtmlFromXamlConverter"做了这个,有一个小缺陷:如果axml包含多个换行符,它将被转换为类似的东西:

<P ><SPAN STYLE="text-decoration:underline;" /> </P>
<P ><SPAN STYLE="text-decoration:underline;" /> </P>
<P ><SPAN STYLE="text-decoration:underline;" /> </P>

仅出现1次换行.我不能插入""作为值,因为有下划线样式.所以问题是,有没有办法配置空P标签<p></p>显示为换行符？

Answer 1

如何添加像这样的微小内联块:

p:after {
  content:"";
  display:inline-block;
  width:0px;
  outline:1px solid red; /* debug, remove me */
}

这将强制甚至空段落为您设置的行高.

Answer 2

此解决方案为空段落提供当前行高：

p:empty:before {
  content: ' ';
  white-space: pre;
}

Answer 3

据我所知,你不能只使用CSS,你必须在段落中添加一个不可破坏的空间:

<p>&nbsp;</p>

Answer 4

已经提到了一些聪明的解决方案，但我喜欢的一种仅使用 CSS 的解决方案是在标签上设置最小高度p。

.myText {
  font-size: 14px;
  line-height: 18px;
}
.myText p {
  min-height: 18px;
}

这将使空p标签占据与其邻居相同的高度，并且您无需费力插入文本。

如果您要显示用户输入，这非常好，因为您可能想再次保存该用户输入，并且需要小心地撕掉所有 s 或您插入的任何其他内容。

对于缺点，它确实需要您有一些包装元素。我也希望我可以使用相对行高，但没有找到一种方法来实现这一点。