pre标签对于HTML中的代码块和在编写脚本时调试输出非常有用,但是我如何使文本换行而不是打印出一行呢?


当前回答

使用空白:预换行和供应商前缀,用于预压纸内的自动断行。

不要使用word-wrap: break-word,因为这只是把一个单词分成两半,这可能是你不想要的。

其他回答

我发现跳过pre标签并在div上使用空白:pre-wrap是一个更好的解决方案。

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

使用空白:预换行和供应商前缀,用于预压纸内的自动断行。

不要使用word-wrap: break-word,因为这只是把一个单词分成两半,这可能是你不想要的。

以下几点帮助了我:

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

谢谢

最简单地说,这迫使内容包装在一个pre标签内,而不中断单词。

pre {
    white-space: pre-wrap;
    word-break: keep-all
}

最好的跨浏览器方式为我工作获得换行和显示准确的代码或文本:(chrome, internet explorer, Firefox)

CSS:

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

HTML:

<xmp> your text or code </xmp>