必须设置 table-layout: fixed 才能使 td 的 min-width 生效，否则浏览器默认按内容宽度优先计算，min-width 被忽略；推荐配合 width 和 标签实现稳定列宽控制。
为什么 td { min-width: 120px } 经常没反应
浏览器对表格单元格的宽度计算优先级是：width（显式设值） > 内容自然宽度 > min-width。在默认 table-layout: auto 下，哪怕你写了 min-width: 120px，只要单元格里只有一串短文本（比如“5”或“是”），它仍可能被压缩到 30px 甚至更窄——min-width 被完全忽略。
根本原因不是 CSS 写错了，而是表格渲染机制本身不把 min-width 当作有效约束。尤其当表头 th 很窄、或整列内容普遍偏短时，后续所有 td 的 min-width 都形同虚设。
- 嵌套在
overflow-x: auto容器里的表格，列宽约束更容易失效 -
white-space: nowrap或text-overflow: ellipsis会干扰宽度计算，让min-width更难起效 - IE8–IE11 对该组合支持极差，即使加了
table-layout: fixed也不稳定
必须加 table-layout: fixed 才能真正启用 min-width
只有给 table 元素显式声明 table-layout: fixed，min-width 在 td/th 上才具备实际约束力。此时列宽主要依据首行单元格的尺寸分配，min-width 才成为可依赖的底线。
推荐写法：
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
table {
table-layout: fixed;
width: 100%;
}
td:nth-child(2) {
min-width: 150px;
width: 20%;
}
- 不配
width仅靠min-width，在某些浏览器下仍可能松动 - 启用
fixed后，长文本若未加white-space: nowrap或overflow: hidden，容易溢出单元格 -
width: 100%是为了确保表格能撑满父容器，否则min-width的百分比值（如min-width: 15%）会因父容器无明确宽度而失效
更可靠的替代方案：<col> 标签直接设宽
在 table-layout: fixed 模式下，<col> 是最稳定、最可控的列宽控制方式。它不依赖内容、不参与样式层叠，且不受后续行影响。
示例：
| 姓名 | 部门 | 备注 |
|---|---|---|
| 张三 | 前端 | 长期维护 |
-
<col>的width值会覆盖所有对应列的min-width和内容宽度 - 如果某列需弹性但有底线，可用
width: 120px+ 后续td加min-width: 120px双保险 - 不要试图在
<colgroup></colgroup>外部用 CSS 选中col并设min-width—— 它不响应这类样式
框架里别混用原生写法：minWidth 不是 min-width
主流 UI 框架封装了表格逻辑，CSS 层面的 min-width 往往被忽略或覆盖。必须使用框架约定的配置项：
- iView / View UI：
minWidth: 120（纯数字，单位隐含为 px） - Element UI：
min-width="150"或:min-width="180"（注意是连字符命名，不是驼峰） - TanStack Table（v8）：
column.minSize控制最小尺寸；v7 是meta.minWidth - React 中直接给
td加 class 设min-width，大概率无效——框架生成的 DOM 结构和样式作用域已隔离
真正容易被忽略的是：不同框架对“最小宽度”的解释不一致——有的指列宽下限，有的指内容区最小可用宽度，还有的会在 resize 时动态重算。上线前务必在目标框架文档里确认术语定义。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
