我需要合并 HTML 表格中的中心单元格，但<td colspan="3" rowspan="3"> </td>不能按预期工作。下图显示了当我使用时会发生什么colspan-rowspan它弄乱了桌子。
我应该如何在不使用colspan. 我真的很想组合表格单元格，这样它们就不会扩大。我可以使用 HTML 还是需要使用 jQuery 解决方案？
问问题
8556 次
1 回答
4
colspan是正确的做法。您遇到的问题是您添加的列比您预期的要多。每次使用colspan大于 1 的 a 时，都需要<td>从该行中剔除相应数量的标签。另外，请记住，使用有效地为跨度覆盖的每一行rowspan添加一个。<td>因此，当您执行 a colspan="3" rowspan="3"then 时，您需要从包含跨单元格的行中删除 2 个单元格，并从接下来的两行中删除三个。
对于带有 3x3 孔的 10x10 桌子，您需要这个
<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>
于 2013-10-04T17:06:57.430 回答