colspan和rowspan是表格结构声明而非样式属性，错误使用会导致DOM静默失真；colspan="n"表示单元格向右占据n列，总和须等于逻辑列数；rowspan="n"则锁定当前列位置共n行，后续行对应列不可再出现单元格。
colspan 和 rowspan 不是样式属性，而是表格结构声明——写错一个值，DOM 就会静悄悄地失真，但浏览器不报错、不警告。
colspan="n" 是占位，不是加宽
它让一个 <td> 或 <th> 向右连续占据 n 列位置，整行所有单元格的 colspan 值加起来必须等于该表的“逻辑列数”（通常由第一行 <th> 数量决定）。
- 错误写法：
colspan="2px"或colspan="two"→ 浏览器直接忽略，当没写 - 表头定义了 4 列，某行却写了
<th colspan="2">A</th><th>B</th><th>C</th><th>D</th>→ 总和是 5，浏览器可能丢弃最后一个或补空，row.cells长度已不对 - 常见翻车：在同一个
<tr>里对相邻<td>都设colspan，比如<td colspan="2">X</td><td colspan="2">Y</td>，结果总列数超限，右侧出现空白列或错位
rowspan="n" 会“锁住”后续行对应列
rowspan 不是拉高单元格，而是从当前行起，锁定该列位置共 n 行（含当前行），后续 n−1 行里，这个列位置不能再出现任何 <td> 或 <th>。
- 典型错误：
<tr><td rowspan="3">合计</td><td>Q1</td></tr>→ 下一行必须只写<tr><td>Q2</td></tr>，不能写<td>Q2</td><td>Q3</td> - DevTools 里看到边框断裂、文字挤在一起，或控制台报
Table row has fewer cells than required，基本就是这儿多写了一个<td> - JS 中访问
row.cells[0]可能返回undefined，尤其在动态插入行后——因为被rowspan占用的列在 DOM 中根本不存在
同时用 rowspan 和 colspan 必须删光被覆盖的单元格
这不是属性叠加，是在二维矩阵里划出一个 a×b 的矩形区域：左上角单元格设 rowspan="a" 和 colspan="b"，其余 a×b−1 个格子必须彻底删除——不能留空 <td></td>，也不能用注释占位。
- 实操验证法：在 Chrome DevTools Elements 面板中右键表格 → “Edit as HTML”，临时删掉可疑
<td>看是否恢复整齐 - 逐行统计每行实际渲染的
<td>/<th>数量，应为「总列数 − 当前已被上层rowspan占用的列数」 - React 渲染或打印 PDF 时纵向错位？大概率是漏删了某个
<td>，DOM 结构已不一致
