结论：用 colspan 属性，即在 <td> 或 <th> 中写 colspan="n"；其本质是删除右侧 n-1 个单元格，需确保每行展开后列数一致，否则错位；对齐须单独设 CSS，table-layout: fixed 下宽度由所跨各列宽度和决定。
colspan 属性，不是加样式、不是套 div、不是改 display，就是往 <td> 或 <th> 里写 colspan="n"。
但写错一行，整张表就错位——这不是浏览器 bug，是你没算清“这一行到底占几列”。
colspan 的本质是删单元格，不是拉宽
colspan="2" 的意思是：“我这个单元格要占用当前列 + 它右边 1 列”，也就是物理上删掉右侧 1 个 <td>。浏览器不会帮你跳过、隐藏或忽略后续单元格。
- 如果整行该有 4 列，你在第一个
<td colspan="3">后又写了<td>B</td>，那这行实际占了 4 列（3+1），没问题 - 但如果后面还写了
<td>C</td>，就变成 5 列（3+1+1）→ 下一行立刻错位，且开发者工具里看不出报错 -
colspan="0"无效，colspan="1"可省略（默认就是 1）
怎么验证每行列数是否一致？
别靠肉眼数 <td> 标签个数。打开浏览器控制台，选中任意 <tr>，运行：
Array.from(tr.children).reduce((sum, el) => sum + (el.colSpan || 1), 0)
结果必须等于表头行展开后的总列数（比如 <thead> 第一行有 3 个 <th>，其中一个是 colspan="2"，那总数就是 2 + 1 = 3）。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
- 所有
<tr>（包括<thead>、<tbody>、<tfoot>）都得过这一关 - 特别注意：
<thead>用了colspan，<tbody>的每行也得按“展开后列数”来写，不能只看<thead>里写了几个<th>
右侧对齐、居中、垂直居中怎么配？
colspan 只管跨列，对齐必须单独设——而且不能设在 <tr> 或 <table> 上，它不继承。
立即学习“前端免费学习笔记（深入）”；
- 水平居中：
<td colspan="2" style="text-align: center">aaa</td> - 右侧对齐：
<td colspan="2" style="text-align: right">aaa</td> - 垂直居中：
vertical-align: middle有效，但需配合line-height或padding；设height容易截断，建议用min-height+padding - 避免用过时的
align="right"属性，CSS 重置或框架可能让它失效
table-layout: fixed（常见于防止内容撑开列宽），colspan 单元格的宽度由它所跨各列的宽度之和决定，不是你写的 width 值。想控制宽度，得先定义 <col> 或第一行的列宽。 
