我需要合并 HTML 表格中的中心单元格，但 <td colspan="3" rowspan="3">&nbsp;</td> 无法按预期工作。下图显示了当我使用 colspan 和 rowspan 时会发生什么 - 它把桌子弄乱了。
我应该如何在不使用colspan 的情况下合并上图中的 9 个单元格。我真的很想组合表格单元格，这样它们就不会扩大。我可以使用 HTML 还是需要使用 jQuery 解决方案？
【问题讨论】：
标签： html merge cell html-table
colspan 是正确的做法。您遇到的问题是您添加的列比您预期的要多。每次使用大于 1 的 colspan 时，都需要从该行中删除相应数量的 <td> 标签。另外，请记住，使用rowspan 有效地将<td> 添加到跨度覆盖的每一行。因此，当您执行 colspan="3" rowspan="3" 时，您需要从包含跨单元格的行中删除 2 个单元格，并从接下来的 两个 行中删除三个。
如果您的 10x10 桌子上有 3x3 孔，您需要这个
<table>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="3" rowspan="3"> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
编辑
我觉得大方而无聊，所以这里有一些 PHP。您可以调整 spansize 和 cellMax 值，一切都应该继续工作。虽然边缘粗糙。我还没有测试所有可能的破解方法。
<?php
function draw_table_with_hole($rows, $cols, $span_start_row, $span_start_col, $span_rows, $span_cols) {
$spanning = 0;
for ($row = 0; $row < $rows; $row++) {
if (--$spanning > 0) {
$cell = $span_cols;
} else {
$cell = 0;
}
echo "<tr>";
for (; $cell < $cols; $cell++) {
$cell_code = "<td> </td>";
if ($row === $span_start_row && $cell === $span_start_col) {
$cell_code = '<td colspan="' . $span_cols . '" rowspan="' . $span_rows . '."> </td>';
$cell += ($span_cols - 1);
$spanning = $span_rows;
}
echo $cell_code;
}
echo "</tr>";
}
}
?>
<table>
<?php draw_table_with_hole(10, 10, 3, 4, 3, 3); ?>
</table>
【讨论】：
for 循环内打印 10*10 表。所以这个解决方案是不可能的。任何想法..？
rowspan 和 colspan 大小例如：colspan 2 和 row span 3 以上 php 代码会出错。