溢出换行和断字之间的区别？

Question

overflow-wrap / word-wrap 和 word-break 之间的确切区别是什么？谁能告诉我打破超长链接的更好方法是什么？大多数人说您应该将分词符与 overflow-wrap 结合使用，但它看起来不太合乎逻辑。我认为将 overflow-wrap 与 word-wrap 结合使用以获得更好的跨浏览器支持是最好的方法。你怎么看？

原文由 Anselm 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

引用来源

• overflow-wrap ： overflow-wrap CSS 属性用于指定浏览器是否可以在单词中换行，以防止在其他情况下无法断开的字符串太长而无法容纳其包含框时溢出。

• word-wrap： word-wrap 属性在CSS3中被重命名为 overflow-wrap 。

• word-break： word-break CSS 属性用于指定如何（或是否）在单词中换行

因此，您需要将分词与换行结合使用，这是正确的组合。

原文由 karthikr 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

这有助于理解，此时 word-break: break-word 实际上是 overflow-wrap: anywhere 的别名。

word-break: break-word 已正式弃用；请参阅 CSS 文本模块第 3 级工作草案：

为了与遗留内容兼容， word-break 属性还支持已弃用的 break-word 关键字。指定时，这与 word-break: normal 和 overflow-wrap: anywhere 具有相同的效果，无论 overflow-wrap 属性的实际值如何。

这里要注意的是 word-break: break-word 是 overflow-wrap: anywhere 的别名，而 不是 overflow-wrap: break-word 的别名

（ word-break: normal 只是 word-break 的默认值，所以你可以忽略它，除非你为 word-break 设置不同的值。）

overflow-wrap: anywhere 和 overflow-wrap: break-word 不同？

两者之间文档的唯一区别是 overflow-wrap: anywhere 在“计算最小内容固有大小”时“考虑由单词 break 引入的软包装机会”，而 overflow-wrap: break-word 才不是。

我想如果考虑宽度，在某些情况下宽度可能更准确？

原文由 Ben Wheeler 发布，翻译遵循 CC BY-SA 4.0 许可协议