Html 没有 <br> 标签的新行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/36191182/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
new line without <br> tag
提问by qadenza
Writing this html:
写这个html：
lorem ipsum
lorem ipsum
lorem ipsum
browser shows:
浏览器显示：
lorem ipsumlorem ipsumlorem ipsum
Is there a way to see this:
有没有办法看到这个：
lorem ipsum
lorem ipsum
lorem ipsum
without using <br>tag at the end of each line, and without using textarea.
<br>在每一行的末尾不使用标签，也不使用 textarea。
I need this because I have a text with 100.000 short lines, and it is time consuming to write <br>tag 100.000 times.
我需要这个，因为我有一个包含 100.000 短行的文本，并且编写<br>标签 100.000 次非常耗时。
回答by szym
You can use the <pre>tag to keep the line breaks.
您可以使用<pre>标签来保留换行符。
<pre>
lorem ipsum
lorem ipsum
lorem ipsum
</pre>
The default style for pretags is monospaced font, but that can be overriden.
pre标签的默认样式是等宽字体，但可以覆盖。
You can achieve the same effect without any extra default formatting using the white-space: preCSS property.
您可以使用white-space: preCSS 属性实现相同的效果，而无需任何额外的默认格式。
<div style="white-space: pre">
lorem ipsum
lorem ipsum
lorem ipsum
</div>
There are several other values for white-space, but you should refer to the documentationto choose the most fitting one.
有几个其他值white-space，但您应该参考文档以选择最合适的值。
Note that prewill treat every line break the same including the one following the <pre>or <div>tags. If you don't want them you will need to do:
请注意，pre将对每个换行符一视同仁，包括<pre>或<div>标记后面的换行符。如果您不想要它们，则需要执行以下操作：
<div style=...>lorem ipsum
lorem ipsum
...
回答by codenvape
Html: You may wrap them in block elements like <div></div>or <h1></h1>
Html：您可以将它们包装在块元素中，例如<div></div>或<h1></h1>
Css: You may use white-space: pre-wrap;
Css：你可以使用 white-space: pre-wrap;
Js: You may use "replace" to change "\n" to <br/>
Js：您可以使用“替换”将“\n”更改为 <br/>
回答by Loi Nguyen Huynh
I would like to deliver some additional ways to achieve the OP's purpose. Yet, the direct answer for the title "new line without <br>tag"would be <pre>or
white-space: pre-wrap;like the above.
我想提供一些额外的方法来实现 OP 的目的。然而，标题“没有<br>标签的新行”的直接答案将是<pre>或
white-space: pre-wrap;像上面那样。
But,
但，
If I need 100000lines of dummy lorem ipsum <br>, I would rather use emmet(which is built-in in VSCode)than write anything myself.
({lorem ipsum <br>}*100)*100
如果我需要100000行 dummy lorem ipsum <br>，我宁愿使用emmet （VSCode内置）而不是自己编写任何东西。
({lorem ipsum <br>}*100)*100
Or, in case these 100000short lines are predefined text, I can search and replace(Ctrl+ H) with regexturned on, replace the regex $(endline)with <br>.
或者，在情况下，这些100000个短线的预定义的文本，我可以搜索和替换（Ctrl+H含）正则表达式打开，更换正则表达式$（endline）使用<br>。
