colgroup 无法统一设置多列宽度，必须逐列定义且数量严格匹配表格列数；width 属性已废弃，须用 css width 配合 table-layout: fixed 才生效，且 colgroup 必须为 table 的直接子元素。
colgroup 不能“统一设置”多列宽度——它只能按顺序逐列定义，span 不广播样式，写错位置或漏掉列数，宽度就直接失效。
col 标签必须一一对应实际列数
表格有 5 列，colgroup 就必须恰好包含 5 个 col（或用 span 精确覆盖全部），少一个，最后一列宽度失控；多一个，多余项完全无用。
-
col按顺序从左到右绑定第 1、2、3… 列，不靠 class 或 id 匹配 - 动态生成表格时，必须同步生成等量
col，不能靠 JS 插入后才补colgroup - 如果用了
col span="2"，它只占位两列，但后续col仍从第 3 列开始计数——别指望自动续上
width 属性已废弃，必须用 CSS width
<col width="120"> 在所有现代浏览器中静默忽略，不是兼容性问题，是标准移除。生效的只有 style="width: 120px" 或 class 驱动的 CSS。
-
width: auto在col中无效，浏览器会当 0 处理 - 百分比值（如
width: 30%）必须配合<table style="width: 100%"> 才能计算，否则被丢弃 <li>推荐用 class：<code><col class="w-120">+.w-120 { width: 120px; }，便于复用和主题切换 - 必须同时设置
<table style="table-layout: fixed; width: 100%">（或具体像素） <li>启用后，首行 <code>th/td的内容长度不再影响列宽分配 - Safari 对漏掉
col更敏感：少一个，对应列可能渲染为 0 宽度，整列内容消失 - 想三列都 100px？写三个
<col style="width: 100px"> - 想三列共占 300px 且等宽？用
<col span="3" style="width: 300px">+table-layout: fixed，但需接受第 1 列独占 300px，后两列由浏览器按剩余空间再分（不可控） - 真正需要跨列统一样式（背景、边框、对齐），改用
td:nth-child(n)或:is(td, th):nth-child()，别依赖span
table-layout: fixed 是硬性前提
没设 table-layout: fixed，col 的 width 就只是参考值——内容一长，列照样撑开，尤其含长文本、图片或嵌套元素时。
span="N" 只占位，不复制样式
<col span="3" style="width: 300px"> 实际只让第 1 列宽 300px，第 2、3 列回退为默认行为（内容撑开或均分剩余空间）。这不是 bug，是规范定义。
最易被忽略的点：colgroup 必须是 <table> 的**直接子元素**，且必须在 <code><caption></caption> 之后、<thead> 之前。放错位置（比如包在 <code><tbody> 里）不会报错，DevTools 里也看不到任何效果——浏览器直接跳过解析，连 warning 都不抛。调试第一件事，就是打开 Elements 面板确认层级。 </tbody>
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
