配合 table-layout: fixed 是唯一真正可靠定义列宽的方式，需 紧贴 后、数量与列数一致，并配合 width（像素或百分比）、table { width: 100% } 及 white-space: nowrap、overflow: hidden 等溢出控制样式才能确保列宽不被内容撑开。
直接用 <col> 配合 table-layout: fixed 才能真正定义每一列的宽度，其他方式（比如只给 <td> 加 <code>width 或只设 table { width: 100% }）基本靠不住，尤其内容长、无空格时会直接撑开。
colgroup + col 是唯一可靠的列宽定义方式
<colgroup></colgroup> 必须紧贴 <table> 开始后、且在 <code><thead> 或第一行 <code><tr> 之前，否则浏览器可能忽略。每个 <code><col> 按顺序对应一列，数量必须和实际列数一致（少写会漏控，多写无效但不报错）。
-
<col style="width: 120px">：固定像素，最稳定，适合关键列（如 ID、操作按钮） -
<col style="width: 30%">：百分比，基于整个<table> 宽度计算，不是父容器 <li> <code><col>不支持flex单位（如1fr），Chrome/Firefox 虽能解析但非标准，别用 - 没写
<col>的列，会退回到自动计算宽度，哪怕你写了table-layout: fixed - 必须显式设置
table { table-layout: fixed; }，不能只靠<col> -
table { width: 100%; }或具体像素值要同步设置，否则fixed布局下宽度可能坍缩 - 如果表格嵌套在 flex/grid 容器里，确保父容器给了明确宽度（比如
min-width），否则100%会失效 -
td, th { white-space: nowrap; }：禁用换行，让内容横向溢出而非撑高列宽 -
td, th { overflow: hidden; text-overflow: ellipsis; }：配合nowrap实现省略号截断（需同时设width或max-width） - 避免在
<td> 上单独设 <code>width，它会和<col>冲突，优先级混乱 -
font-size不影响<col>百分比计算，但会影响text-overflow: ellipsis是否生效（太小字体可能不显示省略号）
table-layout: fixed 是生效前提
不加这个声明，<col> 的 width 只起“建议”作用，浏览器仍按内容撑开列宽。加了之后，列宽才完全由 <col> 或 <th>/</th>
<td> 的 <code>width 决定，首行内容不再影响后续行。
防止单元格内容撑开列宽的关键 CSS
即使列宽设好了，长文本（比如 URL、Base64 字符串）或连续无空格字符串仍会突破限制，必须加约束样式。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
最简可靠组合就是：<table style="table-layout: fixed; width: 100%;">
<colgroup>
<col style="width: 80px">
<col style="width: 20%">
</colgroup>...，再补上 <code>white-space: nowrap 和 overflow: hidden —— 缺一不可，少一个就容易在真实数据里翻车。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
