在div中保留文本：换行符，空格和长词

Question

说我有以下字符串：

"This line should always break on newline \n, spaces if it is about to overflow and veryLongLinksThatDoNotFitInsideTheDiv"

我希望它能够突破：

• \ n（总是）
• 白色空间（如果它即将溢出）
• 长词（如果它不适合整行）
• 但最好不要使用适合下一行（How to limit break-all to only long words?）
的随机小词

基于text flowing out of div，我尝试了：

    <div id="log" style="word-break: break-all"></div>
    <!-- <div id="log" style="word-wrap: break-word"></div> -->
    <!-- <div id="log" style="white-space: pre-line"></div> -->
    <!-- <div id="log" style="white-space: pre; word-break: break-all"></div> -->

但我无法满足所有3（或4）个标准。

小提琴：https://jsfiddle.net/6kq14cfc/

Answer 1

您可以使用

<div id="log" style="overflow-wrap: break-word;white-space: pre-wrap;"></div>

或

<div id="log" style="word-wrap: break-word;word-break: normal;white-space: pre-wrap;"></div>

Answer 2

我认为你的回答在于用“＆lt; br /＆gt;”替换“\ n”。 HTML无法识别换行符 - 它需要＆lt; br /＆gt;而是标记。