以HTML格式呈现字符串并保留空格和换行符

Question

我有一个MVC3应用程序,它有一个详细信息页面.作为其中的一部分,我有一个描述(从数据库中检索)有空格和新行.渲染时,html会忽略新的行和空格.我想编码那些空格和新行,以便它们不被忽略.

你是怎样做的？

我尝试了HTML.Encode,但它最终显示了编码(甚至没有在空格和新行上,而是在其他一些特殊字符上)

Answer 1

只需设置内容样式即可white-space: pre-wrap;.

`white-space:pre-line;`如果你不希望每个段落的第一行缩进. (35认同)
这是一张旧票,但可能仍然值得添加像[MDN](https://developer.mozilla.org/en/docs/Web/CSS/white-space)这样的参考来帮助解释批准的答案正在做什么:) (4认同)
+1 这个解决方案很干净，我建议使用 [SecurityElement.Escape Method](http://msdn.microsoft.com/en-us/library/system.security.securityelement.escape.aspx)。 (3认同)
您提供的css类完全解决了新行不渲染的问题。但我似乎在应用了 css 类的文本之前有一些空白。例如，假设文本只是“abcd”。如果我不包含 css 类，文本“abcd”会出现在页面上的某个位置。但是当我包含 css 类时，文本“abcd”在页面上显示得稍低一些。有办法避免这种情况吗？（我也不确定这个小问题是否特定于我的应用程序，但该应用程序很小，所以我怀疑它可能不是） (2认同)

Answer 2

你尝试过使用<pre>标签吗？

Answer 3

您可以使用white-space:pre-line来保留格式化中的换行符.无需手动插入html元素.

.popover {
    white-space: pre-line;    
}

或添加到您的HTML元素 style="white-space: pre-line;"

Answer 4

您可能希望用替换所有空格 (不间断空格)和所有新行"\n"用<br>(html中的换行符).这应该达到你想要的结果.

body = body.replace('', ).replace('\n','<BR>');

这种性质的东西.

Answer 5

我正在尝试white-space: pre-wrap;皮特所说的技术，但如果绳子是连续且长的，它就会从容器中跑出来，并且不会因任何原因而变形，没有太多时间进行调查..但如果您也有同样的问题，我最终使用了<pre>标签和以下 css，一切都很顺利..

pre {
font-size: inherit;
color: inherit;
border: initial;
padding: initial;
font-family: inherit;
}