如何让提交按钮在3列HTML表格的前两列范围内居中？

很简单的调整！你只需要修改提交按钮所在单元格的colspan属性，再稍微规整一下表格结构，就能让按钮只在前两列范围内居中了。

修改后的完整代码如下：

<table>
  <tr>
    <td align="right">Label 1:</td>
    <td align="left"><input type="text" name="input1"></td>
    <td> <a href="alink">a link</a></td>
  </tr>
  <tr>
    <td align="right">Label 2:</td>
    <td align="left"><input type="text" name="input2"></td>
    <td></td> <!-- 补全第三列，保证每行单元格数量一致，避免布局异常 -->
  </tr>
  <tr>
    <td colspan="2" align="center"><input type="submit" name="submit"></td>
    <td></td> <!-- 第三列留空，不影响按钮的居中范围 -->
  </tr>
</table>

关键修改点： #

• 将提交按钮所在单元格的colspan="3"改成colspan="2"：这会让按钮只占据前两列的宽度，而不是整个表格的三列宽度。
• 给第二行补了空的<td>：虽然浏览器允许每行单元格数量不一致，但补全后表格结构更规范，能避免一些潜在的布局问题。
• 保留align="center"：确保按钮在它所占据的两列范围内水平居中。

如果不需要第三列的空白，你也可以考虑调整表格结构，比如把第三列合并到前两行的对应位置，但上面的方法是最直接适配你现有代码的方案。

内容的提问来源于stack exchange，提问作者ab11