HTML表格中不存在column-span属性，正确做法是使用colspan属性让单元格跨列；colspan是原生HTML属性，值为正整数，需根据实际列数设定，不可用CSS模拟以免破坏语义和导出功能。
column-span 在 HTML 表格中根本不存在
HTML 原生表格不支持 column-span 属性——它不是 CSS 标准属性，也不被任何浏览器识别。你搜到的可能是把 CSS 的 column-span（用于多列布局如 columns）误套用到了表格上，或者混淆了 colspan。
正确做法：用 colspan 让 <th> 或 <td> 跨列
colspan 是 HTML 表格单元格的原生属性，值为正整数，表示该单元格横向占据多少列。要让标题跨所有列，必须知道总列数，或动态计算。
- 静态场景：如果表格固定为 5 列，写
<th colspan="5">汇总标题</th> - 动态场景：服务端渲染或 JS 生成时，先统计
<tr>中第一个数据行的<td>或<th>数量，再赋给colspan - 注意：不要写
colspan="0"或负数，无效；colspan="1"可省略（默认值）
常见错误：用 CSS 强行“撑开”导致结构错乱
有人尝试用 display: table-cell + width: 100% 或 grid-column: 1 / -1 模拟跨列，但这是在破坏表格语义：
- 屏幕阅读器无法正确播报表头与数据的关联关系
- 导出为 Excel 时，该单元格不会真正合并，可能被拆成多列
- 响应式下容易溢出或换行错位，尤其配合
table-layout: fixed时 - 如果表格有
<colgroup>，CSS 宽度可能被覆盖，行为不可预测
复杂点在于“自动适配列数”的边界情况
当表格含嵌套表、rowspan 单元格、或动态增删列时，colspan 值不能硬编码：
立即学习“前端免费学习笔记（深入）”；
- JS 获取列数应基于第一行有效单元格：
document.querySelector('tr').cells.length，而非querySelectorAll('col').length（<col>不一定一一对应） - 如果有
rowspan占位，cells.length仍返回实际渲染列数，通常够用 - 服务端模板（如 Jinja、Thymeleaf）建议把列数作为变量传入，避免 DOM 查询
跨列标题本质是结构标记，不是样式问题——填对 colspan 数字，比任何 CSS 折腾都可靠。
