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

HTML CSS

小哥TomA

2020-03-18

我无法解决这个问题,感到很傻,但是如何关闭自动换行功能?css word-wrap属性可以通过强制启用break-word,但不能强制关闭(只能与normalvalue 一起保留)。

如何强制自动换

第1986篇《如何关闭HTML中的自动换行?》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

4个回答
小小Jim乐 2020.03.18

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

word-break: keep-all;
十三伽罗Harry 2020.03.18

我不知道您为什么找到带有“ nowrap”或“ pre”的“空白”作为解决方案,却没有正确地进行操作:您将文本放在一行中!文本应使用换行符,但默认情况下请不要断行。这是由某些css属性引起的:自动换行,溢出自动换行,断字和连字符。因此,您可以:

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/

Itachi伽罗 2020.03.18

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

white-space: -moz-pre-wrap; /* Firefox */
white-space: -o-pre-wrap; /* Opera */
white-space: pre-wrap; /* Chrome */
word-wrap: break-word; /* IE */
别坑我路易 2020.03.18

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

特别是white-space: nowrapwhite-space: pre是最常用的值。第一个似乎是您所追求的。

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android