table-layout: fixed 是唯一能真正锁住列宽的方案，必须配合 <col> 显式设宽或首行单元格 width、表格自身 width 声明，以及 word-break 或 text-overflow 等内容截断/换行控制，否则仍会被长内容撑开。
table-layout: fixed 是唯一能真正锁住列宽的 CSS 属性
不加 table-layout: fixed，哪怕你给 <col> 设了 width="120"，或者给 <td> 写了 width: 100px，内容一长照样撑开——浏览器默认按内容重算列宽，width 只是“建议值”。table-layout: fixed 才强制按你定义的宽度（或比例）分配空间，无视内容长度。
必须配合以下至少一项才有效：
-
<col>标签显式声明列宽，例如<col width="120"><col><col width="80">；<col>的width优先级高于<th>/<td>的 CSSwidth - 给
<table>设置明确的width（如width: 600px或width: 100%），否则fixed无基准可依 - 加上
word-break: break-all或word-wrap: break-word，否则超长英文/数字串仍会撑破单元格
td 内容过长时怎么不撑开、也不溢出？
只设 width 和 table-layout: fixed 还不够。中文换行正常，但连续无空格字符串（如长 URL、Base64、UUID）会直接突破边界。这时得靠文本截断或强制换行：
- 允许单词内换行：
word-break: break-all（最常用，兼容性好） - 仅在必要时换行（保留单词完整性）：
word-wrap: break-word（旧版 IE 需用overflow-wrap: break-word） - 想截断加省略号：
overflow: hidden; white-space: nowrap; text-overflow: ellipsis，但需同时设width（块级上下文） - 图片/iframe 等替换元素也要管：
max-width: 100%; height: auto，否则它们会强行撑高整行
为什么只写 width/height 不够，还得加 min/max？
单纯写 width: 400px; height: 100px 在移动端缩放、字体放大或某些浏览器渲染下会失效。比如 iOS Safari 缩放 150% 时，height 可能被忽略，导致行高暴增。
立即学习“前端免费学习笔记（深入）”；
稳妥做法是把宽高“锁死”：
- 固定宽度：
min-width: 400px; max-width: 400px; width: 400px（三者都写，防某些 UA 忽略单侧） - 固定高度：
min-height: 100px; max-height: 100px; height: 100px，尤其对<td>有效 - 表格整体也建议加：
min-width: 100%; max-width: 100%，防止父容器收缩时变形
resize: none 对 table 没用，别乱套
resize: none 只作用于可拉伸的表单元素（如 <textarea>、<input type="text">），对 <table> 或 <td> 完全无效——表格本身没有原生拖拽手柄。网上有人误套这个属性，结果毫无作用。
真正要防“拉伸”，是指防内容撑开、防用户拖大 textarea 影响表格布局。所以：
- 表格内部若有
<textarea>，必须单独加resize: none，并配min-height/max-height - 整个表格尺寸稳定，靠的是
table-layout: fixed+col宽度 +word-break组合，不是靠禁用某个伪手柄 - 别在
<table>上写resize，它不支持该属性，CSS 验证器会报错
table 锁布局，td 控尺寸，img 限大小，textarea 去手柄，漏掉任何一层都可能破功。 
