colspan="2"本身不会导致错位，错位源于该行所有单元格colspan总和不等于表格总列数，例如4列表格中写后又跟3个普通，总列数变为5，破坏结构守恒。
colspan="2" 为什么表格错位了
错位不是 colspan 本身的问题，而是同一行中所有单元格的列数总和不等于设计列数。比如表格本该是 4 列，你写了一个 <td colspan="2">，后面却跟了三个普通 <code><td>（各占 1 列），那这行实际占了 5 列，浏览器会强行撑开或补空单元格，下一行就对不上。
<p>关键守恒律：每行所有 <code><td> 和 <code><th> 的 <code>colspan 值加起来，必须严格等于该表格的总列数。默认每个单元格 colspan="1"。
- 先画草图，标出每行每个单元格的
colspan值，再写 HTML - 表头用了
colspan="3"？那<tbody> 每行也得凑够 3 列逻辑宽度——可以是一个 <code><td colspan="3">，也可以是三个 <code><td> <li>避免在同一个 <code><td> 里嵌套另一个带 <code>colspan的表格，旧版 Outlook 和 Safari 容易解析失败colspan 和 table-layout: fixed 一起用会怎样
不报错，但行为变“硬”：列宽由第一行或
<col>决定，colspan单元格会被强制拉伸到所跨列的累计宽度，内容可能溢出、换行异常，甚至文字被截断。如果你真要用
table { table-layout: fixed; }，建议：- 用
<col>显式定义每列宽度，例如<col style="width: 120px"> <col style="width: 80px"> - 别给
colspan单元格设width，改用min-width+white-space: nowrap控制溢出 - 务必在 Safari 和 Outlook（Windows 版）里实测——它们对这种组合的支持最不稳定
rowspan 和 colspan 能不能混用
能，但顺序很重要：先按
rowspan确定行结构，再在剩余列位置上填colspan或普通单元格。比如一个单元格要
rowspan="2" colspan="2"，它所在行的后一列就不能再出现<td>（已被跨列覆盖），下一行对应前两列的位置也必须留空（已被跨行覆盖）。 <ul> <li>动态生成时，<code>rowspan的值得提前算好——统计相同值连续出现的行数，只在首行写rowspan，其余行对应列直接 omit - 用
- JS 修改
rowspan后，DOM 不会自动删掉被跨过的<td>，得手动移除，否则显示重复 <li><code><th> 用 <code>colspan时，记得配scope="col"，不然屏幕阅读器无法关联下方数据单元格什么时候不该用 colspan
当“看起来合并”但逻辑上需要独立语义时，
colspan反而有害。比如仪表盘里把“CPU 使用率”和“内存使用率”放在同一个表头下展示，它们其实是两个独立指标，各自有单位、更新频率、告警逻辑。这时用
colspan会让表格结构失真，排序、筛选、导出 CSV 都难处理，屏幕阅读器也会读错关系。- 更稳妥的做法：用
<div> + Flex 布局模拟分组标题，每个指标仍保持独立的 <code><td> <li>如果必须用表格语义，至少保留每个指标的 <code><th>，用 CSS 视觉对齐，而不是靠 <code>colspan拼合 - 邮件模板里慎用
colspan—— Outlook for Windows 对复杂跨列支持极差，常渲染成空白或错列
- 更稳妥的做法：用
