加了table-layout:fixed后列宽变平均，是因为其列宽仅由第一行或元素决定，后续行的width声明被忽略；若第一行含colspan，则跨列均分宽度，且表格必须设置明确width值，否则百分比失效。
table-layout: fixed 确实能解决内容撑开列宽的问题，但直接加它，反而常让列宽“更失控”——因为它的列宽只认第一行或 <col>，后面所有 width 声明都会被忽略。
为什么加了 table-layout: fixed 后列宽变平均了
浏览器在 fixed 模式下只扫描第一行（或 <col>）来确定每列宽度，后续行的 width、colspan 都不影响列宽分配。一旦第一行有 colspan，比如 <td colspan="2">，那它占的两列就会被均分；如果第一行没显式设宽，所有列就按等宽处理。
<ul>
<li>第一行含 <code>colspan → 被跨的列宽被平均分配，你后边写的 width: 30% 全无效
<table> 设 <code>width → 百分比失去参照，列宽计算退化为自动均分
th/td 写 width 却没放在第一行 → 完全不被读取必须用 <col> 或隐藏首行来定义列宽
可靠方式只有两种：用 <col> 元素（语义清晰、兼容性好），或用一个不可见但参与布局的首行（适合动态生成表格）。
-
<col>必须放在<tbody> 前、<code><thead> 后（或直接在 <code><table> 开头），例如：<pre class="brush:php;toolbar:false;"><table style="table-layout: fixed; width: 100%;"> <col style="width: 60%"> <col style="width: 20%"> <col style="width: 20%"> <tr><td>A</td><td>B</td><td>C</td></tr> </table></pre> <li>隐藏首行要确保它参与渲染（不能用 <code>display: none），推荐：height: 0; font-size: 0; line-height: 0; border: 0;，且该行<th> 或 <code><td> 必须带 <code>width文本溢出和换行必须手动配，
fixed不自动处理table-layout: fixed只管列宽，不管内容怎么塞进去。长 URL、无空格字符串会直接撑破单元格或触发横向滚动。立即学习“前端免费学习笔记（深入）”；
- 强制换行：
word-break: break-all;或word-wrap: break-word;（后者已废弃，优先用前者） - 单行截断：
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; - 避免同时设
min-width/max-width和百分比 —— 它们会冲突，导致列宽计算异常
最易被忽略的一点：所有列宽控制都依赖于表格容器本身有明确宽度（
width: 100%或具体像素值），否则table-layout: fixed会退化成行为不可预测的 fallback 模式。父容器如果是flex或inline元素，务必检查它是否“漏掉”了宽度约束。 - 强制换行：
