html colspan rowspan

Question

我使用html表，colspan和rowspan。我想创建这样的表：

._______________________.
|       |       |       |
|______ |_______|_______|
|___|___|       |___|___|
|       |_______|       |      
|_______|___|___|_______| 

但是找不到解决方案！请帮忙！

Answer 1

您需要使用colspan和rowspan属性，检查我的示例，看看它是如何完成的。当<td>有一个colspan或rowspan时，它会被展开，并且会跳过要在该位置的下一个<td>（请参阅上一个<tr> }只有2 <td> s）。

jsFiddle

<table>
    <tr>
        <td colspan="6">&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td colspan="2" rowspan="2">&nbsp;<br />&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td colspan="2" rowspan="2">&nbsp;<br />&nbsp;</td>
        <td colspan="2" rowspan="2">&nbsp;<br />&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</table>

Answer 2

创建一个包含四行的表格，以及具有以下设置的行中的单元格：

colspan 6

none
none
colspan 2, rowspan 2
none
none

colspan 2, rowspan 2
colspan 2, rowspan 2

none
none

Answer 3

这应该这样做：

<table>
    <tr>
        <td colspan=6>&nbsp;<br>&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td colspan=2 rowspan=2>&nbsp;<br>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td colspan=2 rowspan=2>&nbsp;<br>&nbsp;</td>
        <td colspan=2 rowspan=2>&nbsp;<br>&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</table>

Fiddle