Html Textarea 元素仅在到达空格或制表符时才换行。这很好，直到用户输入了足够多的单词。我正在寻找一种严格执行换行符的方法（例如：即使它导致“loooooooooooo \n ooooooooooong”）。
我发现最好的方法是在每个字母后添加一个零宽度的 unicode 空格，但这会破坏复制和粘贴操作。有人知道更好的方法吗？
注意：我在这里指的是“textarea”元素（即：行为类似于文本输入的元素）——不仅仅是一个普通的旧文本块。
username
问问题
42597 次
7 回答
15
CSS 设置word-wrap:break-word似乎text-wrap:unrestricted是 CSS 3 功能。祝你好运找到在当前实现上执行此操作的方法。
于 2009-03-03T02:54:34.913 回答
8
- quirksmode.org对各种方法进行了概述。
- 有一个相关的 SO 问题：“在 HTML 中，如何在破折号上断字？”
- 在支持它的浏览器中，也
word-wrap: break-word可能会产生预期的效果。
于 2008-09-06T21:57:08.957 回答
4
以 textarea 宽度大小打断长词：
1) 对于现代浏览器：
textarea { word-break: break-all; }
2) 为 IE8 兼容性添加：
textarea { -ms-word-break: break-all; }
https://msdn.microsoft.com/en-us/library/ms531184%28v=vs.85%29.aspx
3) 添加 IE11 兼容性破解：
@media all and (-ms-high-contrast:none) {
*::-ms-backdrop, textarea { white-space: pre; }
}
这段代码运行良好：
-IE 11、Chrome 51、Firefox 46（Windows 7）；
-IE 8、Chrome 49、Firefox 18（Windows Xp）；
-Edge 12.10240，Opera 30（Windows 10）；
于 2016-07-17T14:57:39.750 回答
2
有至少支持的非标准元素 wbr
火狐，http://developer.mozilla.org/En/HTML/Element
Internet Explorer， http: //msdn.microsoft.com/en-us/library/ms535917 (VS.85).aspx
和歌剧。
于 2008-09-06T20:49:28.917 回答
0
我测试了<wbr>， 和害羞; 技巧。这三个都在 IE 7、Firefox 3 和 Chrome 中运行良好。
唯一没有破坏复制/粘贴的是<wbr>标签。
于 2008-09-07T05:10:45.530 回答
0
根据我的测试，当前浏览器中只有 Firefox 具有所描述的行为。所以我想你最好的选择是等待即将发布的 Firefox 3.1 来解决你的问题 :)
于 2009-06-15T12:38:21.003 回答
0
最优雅的方法是使用wrap="soft"整个单词wrap="hard"换行或按字符换行或wrap="off"根本不换行，尽管wrap="off"通常不需要最后一个，因为浏览器会自动使用，就好像它是wrap="off".
例子：
<textarea name="tbox" cols="24" rows="4" wrap="soft"></textarea>
于 2017-03-01T17:09:19.930 回答