正确写法是用 rowspan="2" 并在下一行对应列省略 ，例如第一行写 姓名年龄，第二行只写 25，不可重复写姓名列的 。

HTML 表格里 rowspan 怎么写才不跨错行

合并两行单元格，核心就是用 rowspan="2"，但很多人加完发现表格错位、后续列全乱了——根本原因是没理解它「吃掉」的是当前单元格下方那一行的对应位置，而不是简单“拉长”自己。

常见错误现象：<td rowspan="2">A</td> <td>B</td> 后面那行突然少一列，或者 B 下方空了一格；这是因为 rowspan="2" 让 A 占用了本该属于下一行第一个 <td> 的位置，所以下一行得跳过第一个单元格，从第二个开始写。 <ul><li>必须确保下一行对应列位置不再重复写 <code><td>，否则会多出一列 <li> <code>rowspan 只影响垂直方向，不影响同一行内其他单元格的布局

• 如果要合并 2 行，值就写 "2"，别写 "1"（默认就是 1）或 "0"（无效）

合并前两行第一列时，第二行的 <tr> 怎么写 <p>这是最容易踩坑的场景：你想让第一行第一列覆盖到第二行，但第二行其他列内容还在。关键不是改第一行，而是控制第二行的结构——它得少一个 <code><td>。 <p>正确写法示例：</p> <p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p> <pre class="brush:php;toolbar:false;">&lt;table border=&quot;1&quot;&gt; &lt;tr&gt; &lt;td rowspan=&quot;2&quot;&gt;姓名&lt;/td&gt; &lt;td&gt;年龄&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;25&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt;</pre> <p>注意第二行没有再写姓名列的 <code><td>，只写了年龄对应的 <code><td>。如果误写成 <code><tr> <td>张三</td> <td>25</td> </tr>，就会变成三列，破坏对齐。

用 rowspan 合并时，colspan 能不能一起用

可以，但顺序和逻辑要理清：先决定哪几行被 rowspan 占用，再看这些行里有没有需要横跨的单元格。两者不冲突，但叠加后容易数错格子。

典型问题：想让左上角单元格同时跨 2 行 + 2 列，结果右边或下边内容错位。

• 写 <td rowspan="2" colspan="2">标题</td> 后，它会占据第1–2行、第1–2列共4个格子的位置
• 那么第1行第3列开始、第2行第3列开始，都要手动补上对应内容，不能依赖“自动延续”
• 浏览器渲染时，rowspan 和 colspan 是独立计算的，但最终格子坐标是叠加生效的

为什么加了 rowspan 表格却变宽或换行了

这不是 rowspan 本身的问题，而是它改变了表格的隐式列数计算逻辑，进而影响了浏览器对列宽的自动分配。尤其在没设 <col> 或 CSS table-layout: fixed 时更明显。

真实影响点：

• 合并单元格所在列的内容如果很长，浏览器可能把整列撑宽，连带影响其他行显示
• 某些旧版 IE 对 rowspan 解析有偏差，建议测试时打开开发者工具看实际渲染的单元格边界
• 如果配合了 white-space: nowrap 或图片等不可压缩内容，更容易触发意外换行

复杂点在于：rowspan 看似只是“视觉合并”，实则改变了表格的底层网格结构。哪怕只是两行，也得同步检查上下文所有 <tr> 的列数是否匹配，稍有出入，整个表就可能塌陷或溢出。</tr>