Question

我读过（并试过）：

Break long word with CSS

我现在有：

<span style="font-size: xx-small; white-space: -moz-pre-wrap !important; white-space: -pre-wrap;white-space:
-o-pre-wrap;white-space: pre-wrap; word-wrap: break-word;word-break: break-all;white-space:normal;width: 385px;">

但是仍然大字符串不会自动换行在FF或IE中，但它在Chrome中也有...

（例如：http://ed.je/2L6或http://jsfiddle.net/92kSU/）

Answer 1

在这种情况下，您似乎需要将word-break: break-all设置为更高级别。如果我在Firefox中打开您的示例页面并使用Firebug在word-break: break-all上设置样式.entry-content，那么大字符串会换行。

修改：

或者，您可以将跨越的显示样式设置为内联块。

Answer 2

以下代码段是自动换行的全部内容：

.class_name {
     -ms-word-break: break-all;
     word-break: break-all;

     /* Non standard for webkit */
     word-break: break-word;

     -webkit-hyphens: auto;
     -moz-hyphens: auto;
     -ms-hyphens: auto;
     hyphens: auto;
}

word-break: break-all除IE8和Firefox外都有效，因此您还需要包含ms-word-break前缀行。像往常一样，IE8要求首先添加其前缀行。但是，这并不能解决Firefox的问题。

在FF中，您需要使用一个名为hyphenations的新项目，除Chrome之外，该项目受支持（但可以，因为Chrome会在这个冗长的列表中使用基本word-break: break all）：{{ 1}}。

-webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto;会在正确的位置插入连字符以进行分词，这比仅将单词分成两部分更好。

More information on why this is a catch all.

如何在HTML中打破长字符串？

2 个答案: