col标签必须嵌套在colgroup中且置于thead/tbody前才生效，单独使用被忽略；其width属性仅在table-layout:fixed下起主导作用，不响应CSS宽度声明和事件监听。
col 标签只能用在 <colgroup> 里，单独写无效
直接写 <col width="100"> 在 <table> 下是没用的——浏览器会忽略它。必须包裹在 <colgroup> 中，且要放在 <thead>、<tbody> 之前（或紧贴 <table> 开始后）。否则样式和属性不会生效。
常见错误现象：width、span、class 看似写了，但列宽没变，CSS 也未继承；检查 DOM 就会发现 <col> 节点根本没被渲染或被跳过。
-
<colgroup>是容器，<col>是它的子元素，不能嵌套其他标签 - 如果用了
span属性（如<col span="2">），后续<col>的索引会跳过对应列数 - 多个
<colgroup>可以并存，但每个<col>按顺序作用于表格列，从左到右依次匹配
用 width 控制列宽时，优先级低于 CSS min-width 和 table-layout: fixed
width 属性在 <col> 上只是“建议值”，实际表现取决于 table-layout 计算模式。默认 auto 模式下，内容宽度常压倒 <col> 设置；设为 fixed 后，<col> 的 width 才真正起主导作用。
示例：<col width="120"> 在 table-layout: auto 下可能被长文本撑开；加一句 table { table-layout: fixed; }，列宽才稳定。
立即学习“前端免费学习笔记（深入）”；
-
width值支持像素（"120"）、百分比（"20%"）、相对单位（"1fr"不支持，仅 CSS Grid 支持） - 用 CSS 设置
col { width: 120px; }无效——<col>不是普通元素，不响应大多数 CSS 宽度声明 - 想让某列最小宽度固定，得靠
<col>+table-layout: fixed+ 内容内换行（如word-break: break-word）配合
<col> 不支持 data- 属性或事件监听，别试图绑定 click 或存状态
<col> 是纯语义占位节点，没有渲染盒（rendering box），也不参与事件流。给它加 onclick、data-id 或用 JS 查询 col.dataset.id 都会返回 undefined 或静默失败。
使用场景：你可能想标记“这一列是金额”，然后 JS 动态高亮。正确做法是用 <th> 或 <td> 的 class / data-col-type，或者在 JS 中通过列索引映射逻辑，而不是依赖 <col> 自身属性。
-
<col>支持的 HTML 全局属性极少：仅class、id、style（但style对布局影响有限）、title（鼠标悬停无反应，因无渲染区域） -
class可用于 CSS 选择器（如col.highlight { background: #eee; }），但背景色不会显示——因为没渲染区域；它只对后代元素间接生效（比如配合col.highlight td） - 需要列级交互？改用
<th>的scope="col"+ 类名控制更可靠
多层 <colgroup> 与 span 混用时，列序容易错乱
当表格有分组表头（比如前两列是一组，后三列是另一组），用多个 <colgroup> 加 span 很方便，但列计数容易出错。浏览器按 <col> 出现顺序逐个分配列，不是按视觉位置“画格子”。
错误示例：<colgroup><col span="2"></colgroup><colgroup><col><col><col></colgroup> 表示总共 5 列；但如果第二个 <colgroup> 里只写了两个 <col>，第三列就没了定义——它不会自动补默认行为，而是沿用前一个 <col> 的属性（如果有）或回退到浏览器默认。
- 用
span时，确保所有列都被显式覆盖，可用document.querySelectorAll('col').length核对是否等于总列数 - 避免混合使用带
span和不带span的<col>——例如<col span="2"><col>表示第 1–2 列共用属性，第 3 列单独，第 4 列起无定义 - 复杂结构建议先手算列索引，再写
<colgroup>，比边试边调更快
<col> 的“非渲染性”和“列序绑定机制”——它不响应事件、不渲染样式、不独立存在，全靠表格结构上下文才有意义。漏掉 <colgroup> 或算错列数，问题往往静默发生，很难 debug。 
