td/th直接写min-width无效是因为表格默认table-layout: auto，列宽由内容决定，min-width优先级最低；必须设置table-layout: fixed并配合col标签、首行声明或nth-child等明确列宽依据才能生效。
td/th直接写min-width为什么没反应
因为表格默认用table-layout: auto，列宽由内容撑开，min-width在计算优先级里排最后——比内容宽度还靠后。哪怕你写了td { min-width: 150px }，里面只放一个“1”，单元格照样缩成20px。
常见错误现象包括：列宽忽大忽小、响应式下某列突然塌陷、后台动态渲染后宽度失控。
- 必须给
table加table-layout: fixed，否则min-width基本无效 -
th的宽度会影响整列，如果表头文字短，td再设min-width也难生效 - 嵌套表格或外层有
overflow-x: auto时，列宽约束更容易被忽略
table-layout: fixed怎么配才稳
光写table-layout: fixed还不够，它需要明确的列宽依据才能把min-width真正用起来。
推荐组合：table { table-layout: fixed; width: 100%; }，再配合以下任一方式定义列宽：
- 用
<col>标签显式设宽：<col style="width: 120px">（最稳定，不依赖内容） - 只在第一行
th或td上设min-width，后续行别重复写（表格渲染机制只读首行尺寸声明） - 用
nth-child选择器分列控制：td:nth-child(2) { min-width: 180px; width: 25%; }
注意：fixed布局下，长文本默认会溢出，得配white-space: nowrap或overflow: hidden。
不同框架里minWidth怎么写
UI框架封装了原生表格逻辑，CSS写法和配置项写法不能混用，否则min-width会被忽略。
- iView / View UI：列配置用
minWidth: 120（纯数字，单位隐含为px） - Element UI：属性名是
min-width（连字符），值可写min-width="150"或:min-width="180" - React Table / TanStack Table v8：列定义里传
minSize；v7用meta.minWidth
框架内部通常已设table-layout: fixed，但若自定义样式覆盖了它，minWidth仍会失效。
容易被忽略的兼容与兜底细节
IE8–IE11对td上min-width支持极差，哪怕加了table-layout: fixed也不稳定；移动端 Safari 在某些 zoom 场景下也可能弱化行为。
百分比写法如min-width: 15%只在fixed布局下有效，且依赖父容器有明确宽度——如果父容器width没设，15%就等于0。
- 慎用
!important强打min-width，大概率是table-layout漏设了，掩盖真问题 - 兜底方案：给
table外层包一层div，设min-width，再让table { width: 100%; } -
min-width和width冲突时，min-width永远赢：width: 100px; min-width: 200px;→ 最终宽是200px
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
