table-layout: fixed 单独使用无效，必须配合表格显式宽度、或首行单元格宽度声明及溢出控制；其列宽依据三级优先级： > 首行/宽度 > 均分，缺一则退化为内容驱动布局。
table-layout: fixed 单独写在 CSS 里基本没用，必须配合 table 的显式宽度、<col> 或第一行单元格的宽度声明，以及文本溢出控制，才能真正固定列宽。
为什么 table-layout: fixed 加了却没生效
浏览器只按“预设宽度来源”分配列宽，不是写了 fixed 就自动固定。它按三级优先级找依据：<col> > 第一行 <th>/</th>
<td> 的 <code>width（HTML 属性或内联 style）> 均分。如果全没提供，就退回到内容驱动的均分，小屏下尤其容易崩。
-
table没设width（如width: 100%或width: 600px），fixed就失去基准 - 父容器是
display: inline或未设宽的flex容器，百分比解析失败 - 用了废弃写法
<col width="120">—— 现代浏览器静默忽略，必须改用<col style="width: 120px"> - 第一行单元格里写了
white-space: nowrap+ 长文本，内容不换行又不截断，看起来像“列没固定住”
怎么用 <col> 精确控制每列宽度
<col> 必须配合 table-layout: fixed 才有效；单独设 width 不起作用。它不是“给列加样式”，而是为列宽提供计算依据。
-
<colgroup></colgroup>必须紧贴<table> 开始后、<code><thead> 前，不能塞进 <code><tbody> 里 <li>每个 <code><col>对应一列，顺序错一位，整列样式就错位 -
span="n"表示该<col>覆盖从当前位置起的 n 列，但样式**只作用于第一列**，其余列不会继承 - 要三列等宽，得写三个
<col style="width: 150px">，不能靠一个span="3" - 百分比值合法（如
style="width: 25%"），但前提是table有明确宽度（如width: 100%） - 需要截断的列（如 ID、操作按钮）：加
overflow: hidden+text-overflow: ellipsis+white-space: nowrap，且确保该单元格有明确宽度（来自<col>或width） - 需要换行的列（如标题、描述）：用
word-break: break-word或overflow-wrap: break-word，避免无空格长串溢出 - 务必给
<td> 和 <code><th> 设 <code>vertical-align: top，否则多行文本上下错位 -
text-overflow: ellipsis在表格中生效的前提是：父级没设white-space: nowrap，且单元格display是默认的table-cell
固定宽度表格里文字溢出怎么处理
table-layout: fixed 下，长文本默认会撑破单元格或换行异常，必须手动干预。
最常被跳过的其实是 <col> 的位置和写法 —— 它必须是 <table> 的直接子元素，且现代浏览器只认 CSS <code>style 写法，width 属性已失效。动态列数场景下，还得用 JS 插入对应数量的 <col>，手写死数量会漏掉最后一列。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
