停止自动换行分割单词答案

【问题标题】：Stop word-wrap dividing words停止自动换行分割单词
【发布时间】：2010-09-23 06:11:34
【问题描述】：

body { word-wrap: break-word;}

我一直在使用该代码（上面）将body 中的文本放入它的容器中。然而，我不喜欢它，它打破了文字。

是否有另一种方法可以不分词，只在单词之后或之前换行？

编辑：这是用于UIWebView。

【问题讨论】：

你认为“break-word”是什么意思？
我知道，但我说“还有其他方法吗”。
唉word-wrap: normal; 没有帮助。如果您尝试将单词包装在表格单元格中（我的情况），单独white-space: wrap; 也无济于事。

标签： css uiwebview word-wrap

【解决方案1】：

使用white-space: nowrap;。如果您在设置它的元素上设置了宽度，它应该可以工作。

更新 - 在 Firefox 中呈现数据

【讨论】：

不，仍然没有。此代码仍显示带有水平滚动条的全文。 body { width: 768px; white-space: wrap;}
只需设置宽度即可处理您需要的文本（至少在 Firefox 上）。你能检查特定浏览器上的行为并更新帖子吗
wrap 是一个无效的属性值
这应该不是正确答案，white-space: wrap; 不是有效的属性值
其实是white-space: nowrap。

【解决方案2】：

可能有点晚了，但你可以添加这个 css 来停止分词：

.element {
    -webkit-hyphens: none;
    -moz-hyphens:    none;
    -ms-hyphens:     none;
    hyphens:         none;
}

【讨论】：

【解决方案3】：

请使用 nowrap 和 wrap 价值没有为我而来。 nowrap 解决了这个问题。

white-space: nowrap;

【讨论】：

这可以防止单词中断 - 但它也可以防止整行文本中断。

【解决方案4】：

我遇到了同样的问题，我使用以下 css 解决了它：

.className {
  white-space:pre-wrap;
  word-break:break-word;
}

【讨论】：

在此之前唯一对我有用的东西。

【解决方案5】：

你可以试试这个……

body{
white-space: pre; /* CSS2 */
white-space: -moz-pre-wrap; /* Mozilla */
white-space: -hp-pre-wrap; /* HP printers */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
word-wrap: break-word; /* IE */
}

{word-wrap:;} 是 IE 专有属性，而不是 css 的一部分。 firefox 的处理是正确的。不幸的是，FF 不支持软连字符 / 。所以这不是一个选择。您可以分别插入头发或细空格，&hairsp;/ （在数字实体上检查我）和 / 。

制作 {overflow: hidden;} 会切断溢出，而 {overflow: auto;} 会导致溢出启用滚动。

【讨论】：

你给我的例子都没有真正起作用，唯一起作用的是word-wrap。
替代方案是 {overflow: hidden;} 和 {overflow: auto;} 但也有问题。
是的，但这不是我想要的，因为overflow: hidden; 会将所有内容隐藏在边缘。 ://
这并不能回答问题——即如何防止断字。

【解决方案6】：

在我的情况下，我试图确保单词在表格单元格内的正确断字处换行。

我发现我需要以下 CSS 来实现这一点。

table {
  table-layout:fixed;
}
td {
  white-space: wrap;
}

还要检查没有其他东西将word-break 更改为break-word 而不是normal。

【讨论】：

【解决方案7】：

对我来说，父母比这个词小。添加会中断空格，但不会中断单词：

    word-break: initial;

【讨论】：

【解决方案8】：

我在我们的网站上使用此代码来阻止断字：

body {
    -ms-hyphens: none;
    -webkit-hyphens: none;
    hyphens: none;
}

【讨论】：

【解决方案9】：

使用white-space: nowrap;

CSS 空白属性

Know more about white-space example

【讨论】：

【解决方案10】：

Firefox 浏览器的分词问题。所以你可以用它来防止断词：

-webkit-hyphens: none;
-moz-hyphens: none;
hyphens: none;

【讨论】：

【解决方案11】：

我在网格结构中遇到了类似的问题，我使用了 word-break: break-word; 在我的网格中，我的问题得到了解决。

【讨论】：

word-break 属性没有 break-word 值。
这并不能回答问题——即如何防止断字。

【解决方案12】：

这对我使用旧的 Webkit 有所帮助——这个来自 phantomjs 2.1

.table td {
    overflow-wrap: break-spaces;
    word-break: normal;
}

【讨论】：