先查 white-space 和 table-layout：td 默认 white-space: nowrap 锁死换行，需设 white-space: normal 再配 overflow-wrap: break-word；table-layout: fixed 时 td 必须显式设 width 或 max-width，否则样式失效。

表格里URL不换行？先查 white-space 和 table-layout

绝大多数情况下，<td> 里的长 URL 死活不换行，不是因为你没加 word-break，而是它默认就锁死了换行能力：white-space: nowrap。哪怕你写了 overflow-wrap: break-word，也压根不起作用。

修复顺序必须是：

• 给 <td> 加 white-space: normal（或 pre-wrap）
• 再加 overflow-wrap: break-word（别用已废弃的 word-wrap: break-word）
• 如果父 <table> 设了 table-layout: fixed，必须给该 <td> 显式设 width 或 max-width，否则样式被 layout 锁死
• Flex/Grid 布局下的 <td> 还要额外加 min-width: 0，否则默认的 min-width: auto 会阻止收缩

overflow-wrap: break-word 是 URL 换行首选，不是 word-break: break-all

word-break: break-all 会把 https://example.com/very/long/path 拆成 https:/ /examp le.com/ve ry/lo ng/pa th——斜杠前后硬切，语义断裂，还可能影响复制粘贴。它适合哈希、UUID 这类纯机器字符串，但不适合可读 URL。

overflow-wrap: break-word 才是正解：优先在 /、.、- 等自然分隔符处断，实在放不下才进单词内部切。它只响应“溢出”，不主动出击。

立即学习“前端免费学习笔记（深入）”；

注意两点：

论文常用的tex格式转换为word格式，核心是能转换数学公式（非图片），表格，图表等等

将 LaTeX（.tex）学术论文转换为 Word（.docx），支持可编辑的 OMML 公式、原生 Word 表格、嵌入图形、IEEE 双栏排版及参考文献

下载

• 必须配 width 或 max-width，否则它找不到“边界”，不会触发
• 不要和 word-break: break-all 同时写——前者会覆盖后者，且 Firefox 可能渲染异常

移动端 Safari 和旧 Android WebView 的兼容细节

iOS 15 以下 Safari 对零宽空格 ​ 渲染有轻微间距问题，但 overflow-wrap: break-word 本身支持稳定；Android 4.x 的 WebView 对 overflow-wrap 解析不一致，建议真机测试。

服务端预处理比前端 JS 更可靠：在 URL 的 /、?、& 后插入 ​，前端无需任何 JS 就能响应式折行。例如：https://example.com/very​long​path。

别依赖 text-overflow: ellipsis 直接截 URL——它只对块级元素生效，且要求 display 不是 inline，<td> 默认是 table-cell，得额外设 display: block 才能用。

为什么加了 overflow: hidden 还是溢出？

常见失效原因是：溢出源不在你写的那个 <td> 上，而在其子节点里——比如裸文本、<pre>、或未重置 white-space 的内联元素。你只给父容器加 overflow: hidden，根本拦不住。

特别注意：<pre> 和 <code> 默认 white-space: pre，无视父级 overflow，必须单独加 white-space: pre-wrap 或 overflow-x: auto。

表格单元格里嵌套 Flex 项时，若没设 min-width: 0，文本会优先撑开容器，overflow 完全不生效。

实际效果取决于你是否控制住了 white-space、table-layout 和 min-width 这三个隐性开关，而不是单纯堆砌 word-break。