如何在预标签中包装文字？

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>>

pre标记对于HTML中的代码块以及编写脚本时调试输出非常有用，但是如何使文本自动换行而不是打印长行呢？

---

#1楼

以下内容帮助了我：

pre {
    white-space: normal;
    word-wrap: break-word;
}

谢谢

---

#2楼

我发现跳过pre标签并使用空格：在div上进行预包装是更好的解决方案。

 <div style="white-space: pre-wrap;">content</div>

---

#3楼

这就是我所需要的。 它可以防止单词断断续续，但可以保留前置区域的动态宽度。

word-break: keep-all;

---

#4楼

答案，来自此页面的CSS：

pre {
    white-space: pre-wrap;       /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

---

#5楼

您可以：

pre { white-space: normal; }

保持等宽字体但添加自动换行，或：

pre { overflow: auto; }

这将允许使用水平滚动来固定尺寸的长行。

来源：oschina

链接：https://my.oschina.net/u/3797416/blog/3147397