td内容不换行大概率是white-space被设为nowrap，应检查并覆盖为normal或pre-wrap；含\n文本需用pre-wrap保留换行且自动折行；无空格长串须配合overflow-wrap: break-word，避免使用break-all或keep-all。
td内容不换行，大概率是white-space被锁死了
表格单元格默认支持换行，但很多项目里一串长URL或中文堆在一起就是不折行——八成是因为某处CSS偷偷加了white-space: nowrap。Bootstrap 4+、某些UI组件库、甚至自定义重置样式都爱干这事。先用浏览器开发者工具检查td计算后的white-space值，不是normal或pre-wrap就立刻覆盖掉。
想保留用户输入的\n换行，必须用white-space: pre-wrap
后端返回带\n的文本（比如评论、日志），直接塞进td里，浏览器会把它当空格处理，整段塌成一行。这时候white-space: normal能折行但丢掉原始换行；white-space: pre保留换行但不自动折长行，容易横向溢出。唯一解是：white-space: pre-wrap。
- 它原样保留所有
\n、\t和连续空格 - 同时允许在容器右边界自动折行
- 不用额外套
<p></p>或<pre class="brush:php;toolbar:false;"></pre>，语义干净 - 别跟
text-overflow: ellipsis一起用——二者逻辑冲突，省略号不会出现
纯英文/URL/无空格长串，靠overflow-wrap: break-word
遇到https://a.b.c.d.e.f.g.h.i.j.k.l.m.n.o.p或身份证号这类无空格长串，white-space: pre-wrap也救不了——浏览器默认只在空格、连字符或标点处断行。这时得靠overflow-wrap: break-word（旧写法word-wrap: break-word仍可兼容）。
-
overflow-wrap: break-word只在整词放不下时才断，安全可靠 - 别用
word-break: break-all，它会在任意字符间切，“用户”可能变成“用”+“户” -
word-break: keep-all在中文下基本等于禁用换行，和overflow-wrap混用反而失效
table-layout: fixed不是万能钥匙，反而容易搞乱列宽
网上常见方案是给table加table-layout: fixed，再给td设固定宽度和word-break: break-all。这确实能让内容强行折行，但副作用明显：所有td列宽被均分，破坏响应式布局，且无法按内容自适应。
- 如果真要用
table-layout: fixed，必须配合col或colgroup显式定义每列宽度 - 更稳妥的做法是去掉
table-layout: fixed，只对具体td设width+overflow-wrap: break-word+white-space: pre-wrap - 注意：若
td父级是flex容器，还需给该td加min-width: 0，否则换行逻辑会被绕过
最常被忽略的点：换行不是单靠一个CSS属性就能搞定的事，white-space、overflow-wrap、min-width三者得协同生效。单独调其中一个，大概率还是溢出或错位。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
