2013-03-22 85 views
-3

我使用html表,colspan和rowspan。我想创建这样的表格:html colspan rowspan

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

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

+1

你有什么到目前为止 – 2013-03-22 13:29:23

+0

我试图创建 3细胞机智h colspan2 rowspan2 cell cell,colpan2rowspan2 cell,cell cell cell with colspan2 rowspan2,cell cell,cell with colspan2 rowspan2 – Moldaone 2013-03-22 13:37:45

回答

0

做一个表,四排,并在列细胞与这些设置:

colspan 6 

none 
none 
colspan 2, rowspan 2 
none 
none 

colspan 2, rowspan 2 
colspan 2, rowspan 2 

none 
none 
2

您需要使用colspanrowspan属性,检查我的例子,看看它是如何做。当你<td>有一个colspanrowspan它被扩展,并且意味着在那个位置的下一个<td>被跳过(见最后的<tr>只有2 <td> s)。

table

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> 
+0

是啊!我必须使用/ br标签:) – Moldaone 2013-03-22 13:39:03

+0

谢谢!是工作! 我必须使用/ br,这就是为什么我的桌子不工作! – Moldaone 2013-03-22 13:39:57

+0

很高兴听到:)不要忘记通过点击打勾来接受答案。 – 2013-03-22 13:40:33

0

这应做到:

<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

相关问题