WIDTH属性在TD上常失效是因为默认table-layout: auto模式下width仅为建议值，需设table-layout: fixed并置于首行或用col元素才能精确控制列宽。
WIDTH属性在TD上为什么经常失效？
浏览器对 width 属性的处理取决于表格的 table-layout 计算模式。默认是 auto，此时 width 只作为“建议值”，实际宽度由内容撑开，哪怕你写了 <td width="20%"> 或 <td width="150">，也可能被忽略。
-
table-layout: auto（默认）：列宽由最长单元格内容决定，width 仅影响该列最小宽度，不强制分配
-
table-layout: fixed：整行第一行 th/td 的 width 值直接决定各列宽度，后续行不再影响列宽计算
table-layout: auto（默认）：列宽由最长单元格内容决定，width 仅影响该列最小宽度，不强制分配table-layout: fixed：整行第一行 th/td 的 width 值直接决定各列宽度，后续行不再影响列宽计算所以，想用 width 精确控制列宽，必须显式设置 table-layout: fixed，且把宽度定义放在第一行（或 col 元素上更稳妥）。
用COL标签定义比例宽度最可靠col 是唯一专为列宽控制设计的语义化元素，配合 table-layout: fixed 能稳定实现比例分配。
<table style="table-layout: fixed; width: 100%;">
<col width="20%">
<col width="30%">
<col width="50%">
<tbody>
<tr><td>A</td><td>B</td><td>C</td></tr>
</tbody>
</table>
-
col 的 width 支持百分比、像素、数字（如 width="2" 表示相对权重，但需所有 col 都用数字才生效）
- 百分比基于表格总宽计算，不受内容影响
- 不要混用单位（比如一个写
20%，另一个写 100px），否则比例可能意外崩坏
TD上的WIDTH属性只在fixed模式+首行生效
如果坚持用 td 的 width 属性（比如从旧系统迁移），必须满足两个硬性条件：
- 表格 CSS 必须含
table-layout: fixed
- 宽度值必须写在第一行的
td 或 th 上（后续行的 width 会被忽略）
col 的 width 支持百分比、像素、数字（如 width="2" 表示相对权重，但需所有 col 都用数字才生效）20%，另一个写 100px），否则比例可能意外崩坏td 的 width 属性（比如从旧系统迁移），必须满足两个硬性条件：
- 表格 CSS 必须含
table-layout: fixed - 宽度值必须写在第一行的
td或th上（后续行的width会被忽略）
例如：
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
<table style="table-layout: fixed; width: 800px;">
<tr>
<td width="200">固定200px</td>
<td width="30%">占剩余宽度30%</td>
<td width="50%">占剩余宽度50%</td>
</tr>
<tr><td>内容再长也不会撑宽</td><td>同上</td><td>同上</td></tr>
</table>- 第一行的
width值相加不等于100%时，浏览器会按比例重算（比如200+30%+50%→ 先算像素部分，再把剩余空间按百分比分） - 后续行写
width没用，DOM里能看到属性，但渲染完全不认
百分比宽度在嵌套表格或flex容器里容易失灵
如果你的 table 被包在 div 里，而这个 div 没有明确宽度（比如只设了 max-width 或 display: flex），那么 width="30%" 就会失去参照系——它按谁的100%算？
- 父容器必须有可计算的宽度（
width、max-width + 内容足够宽、或 flex item 的 flex-basis）
- 避免把表格放进
display: inline-block 容器，它的宽度行为不稳定
- 如果父级是
flex，建议给 table 显式设 flex: 0 0 auto 或固定 width，否则 table-layout: fixed 可能被 flex 强制重排
width、max-width + 内容足够宽、或 flex item 的 flex-basis）display: inline-block 容器，它的宽度行为不稳定flex，建议给 table 显式设 flex: 0 0 auto 或固定 width，否则 table-layout: fixed 可能被 flex 强制重排真正难的不是写对那一行代码，而是确认整个宽度链路上每个父级都有确定的尺寸上下文——漏掉一层，比例就漂了。
