如何关闭 HTML 中的自动换行？

您需要使用 CSS white-space 属性。

特别是，white-space: nowrap 和 white-space: pre 是最常用的值。第一个似乎是你所追求的。

添加了上面缺少的 webkit 特定值

white-space: -moz-pre-wrap; /* Firefox */
white-space: -o-pre-wrap; /* Opera */
white-space: pre-wrap; /* Chrome */
word-wrap: break-word; /* IE */

我想知道为什么您会找到带有“nowrap”或“pre”的“空白”作为解决方案，它的行为不正确：您将文本强制放在一行中！文本应该换行，但默认情况下不应该换行。这是由一些 css 属性引起的：word-wrap、overflow-wrap、word-break 和连字符。所以你可以有：

word-break: break-all;
word-wrap: break-word;
overflow-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;

所以解决方案是删除它们，或者用“未设置”或“正常”覆盖它们：

word-break: unset;
word-wrap: unset;
overflow-wrap: unset;
-webkit-hyphens: unset;
-moz-hyphens: unset;
-ms-hyphens: unset;
hyphens: unset;

更新：我还提供了 JSfiddle 的证明：https://jsfiddle.net/azozp8rr/

white-space: nowrap;：永远不会破坏文本，将保留其他默认值

white-space: pre;：永远不会打断文本，将多个空格一个接一个地保留为多个空格，如果明确写入 break（在 html 中按 enter 等）将打断

这对我来说可以阻止在 Chrome 文本区域中发生愚蠢的工作中断

word-break: keep-all;

如果您需要纯 HTML 解决方案，我们可以使用 pre 标记。它定义了“预格式化文本”，这意味着它不格式化自动换行。这是一个简单的例子来解释：

div { 宽度：200px;高度：200px；填充：20px；背景：#adf; } 前 { 宽度：200px;高度：200px；填充：20px；字体：继承；背景：#fda； }

pre标签来救场了！耶！但是，对于可能导致的任何水平滚动条，我们提前致歉。如果您需要支持，请提出支持票。