html中table如何占位,HTML中table标签如何跨行跨列详解

原标题：HTML中table标签如何跨行跨列详解

标签table：以前非常流行于网页的布局，现在主要用于后台页面的制作，还有做一些记录数据的表格，所以在很多数据表格中有些栏目要求合并显示，这时就要用到table的跨行跨列方法才能达到那种需求。

首先，我们来看一下表格的结构，效果如下图所示

知道表格的一些结构后，我相信大家对表格的代码编写一定很熟悉，下面就先从简单的跨行跨列讲解：

跨2列的例子：

效果如下：

分析可知，图中表的结构是2行，然后第一行跨了2列的位置，用colspan="2" 来实现，如果记不住就用简单的记法，我一般这样记，就记colspan代表水平方向的合并

右跨2行：

Html代码先读第1行第1列，然后读到第2列时遇到rowspan＝2 ，那么预留2行的位置然后再读第2行第1列。

跨2行和跨2列结合：

开始先读第1行第1列，预留2行，读出第1行的2，3列，然后读第2行的1，2列，然后读第3行的第一列，后来再读第2列横跨2列。

是不是很简单，了解这几个例子以后碰到什么样的合并表格实现的话应该不难了！返回搜狐，查看更多

责任编辑：