col元素不支持min-width样式，必须将min-width设在第一行th或td上并配合table-layout:fixed；col仅响应width属性，且需与列数严格匹配、位置正确。

col 元素不支持 min-width 样式

是纯结构化标签，只响应 width（CSS 属性），不接受 min-width、max-width 或任何内容相关样式。哪怕你写 ，浏览器会完全忽略它——这不是 bug，是规范行为（HTML5 明确限定 只参与列宽分配，不参与盒模型约束）。

常见错误现象： 看似生效，实则是后续 td 的 min-width 在起作用， 本身没参与。

• 必须放在 内，且是 的直接子元素（ 后、 前）
  多个
  必须与表格实际列数严格匹配，少一个，最后一列就失控
  span 属性不“广播”宽度：
  只影响第 1 列，第 2 列仍按默认逻辑算

  真正起效的最小宽度控制必须落在 td/th 上

  要让最小宽度可依赖，得把 min-width 写在第一行的

  设 width + td/th 设 min-width 双保险

  把

  当作列宽基准，把 td/th 的 min-width 当作兜底。这样既利用 的稳定性，又保留弹性空间。

  示例：

  

  HTML Text Extract

  从HTML页面（URL、文件或标准输入）中提取主体内容文本，去除导航、页脚、广告和模板文本。可直接传递给readability_check或其他文本工具。

  下载

  或

  上，并配合 table-layout: fixed。此时浏览器才按首行尺寸分配列宽，min-width 才成为底线。 示例写法： table { table-layout: fixed; width: 100%; } th:first-child, td:first-child { min-width: 120px; } th:nth-child(2), td:nth-child(2) { min-width: 80px; } 只设 min-width 不够稳定：某些浏览器下仍可能松动，建议同时加 width（如 width: 150px 或 width: 20%） 长文本需配合 white-space: nowrap 和 overflow: hidden，否则溢出会破坏宽度约束 IE8–IE11 对该组合支持极差，即使加了 table-layout: fixed 也不稳定 更可靠的做法：用

  姓名	部门	备注
  张三	前端	长期维护

  CSS 配套：

  table { table-layout: fixed; width: 100%; }
  td:nth-child(3), th:nth-child(3) { min-width: 200px; }

  • 的 width 会覆盖所有对应列的 min-width 和内容宽度，所以第三列没设 width，才轮到 min-width 发挥作用
  • 若某列需“弹性但有底线”，可用 width: 120px + 后续 td 加 min-width: 120px，双重保障
  • 不要试图用 CSS 选中 col 并设 min-width，它不响应这类样式（2026年8月4日验证）

  嵌套在 overflow-x: auto 容器里的表格特别容易失效

  当表格被包在 overflow-x: auto 的容器里时，父容器的宽度计算常不明确，导致 table-layout: fixed 下的百分比 width 或 min-width 失效——尤其在移动端或动态加载场景。

  • 确保 有明确宽度（如 width: 100% 或固定像素值），否则 min-width: 15% 这类写法会因父容器无宽而退化
    white-space: nowrap 或 text-overflow: ellipsis 会干扰宽度计算，让 min-width 更难起效
    如果列内容差异极大（比如一列全是短数字，另一列是长 URL），优先用
    控制，别只靠 td 的 min-width

    复杂点在于：表格渲染机制本身不把 min-width 当作有效约束，它只是盒模型里的一个“建议值”。真正可控的，永远是

    的 width 和首行单元格的显式尺寸。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！