Question

我必须在div中的段落中显示非常长的句子。有几件事我必须照顾这种情况。 1.线条不应超出界限2.句子的包装/破坏应在适当的位置进行，例如单词之间的空格。以下CSS在Chrome中运行良好。代码来自https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/，稍作修改。

 .handle-long-sentence{
     white-space: normal;

     overflow-wrap: break-word;
     word-wrap: break-word;

     -ms-word-break: break-all;
     word-break: break-all;
     word-break: break-word;

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

  }

在IE11中，段落显示为与在各个地方随机破坏的单词齐平。

由于

Answer 1

最后我发现了CSS在所有三个主流浏览器中都有效

.handle-long-sentence{
   white-space:normal;
   white-space: -moz-pre-wrap; /* Mozilla */ 
   -ms-hyphens: auto;
   -moz-hyphens: auto;
   -webkit-hyphens: auto;
   -o-hyphens: auto;
   hyphens: auto;
}

每当一个单词被破坏时，这会在IE中加一个连字符。在Chrome和Firefox中，没有任何单词被破坏，单词之间的空格用于自动换行。

如何在IE中的正确位置打破长句

1 个答案: