table中单元格跨列实现方法总结

实现页面元素布局可以通过div+css实现,也可以使用传统的table方式。本文只讨论table布局中的问题。

对于单元格跨行,比如要实现两行两列,并且第一列合并的效果。

合并单元格 第一行第二列
第二行第二列

代码:

<table width="60%">
  <tr>
    <td rowspan="2">合并单元格</td>
    <td>第一行第二列</td>
  </tr>
  <tr>
    <td>第二行第二列</td>
  </tr>
</table>

从代码中可以看到,带有合并单元格的那一行的列数要多一列。第二行虽然只有一列,但是实际显示效果却是第二列。

posted @ 2011-03-10 20:46  josephchan  阅读(5956)  评论(0编辑  收藏  举报