在 HTML 表格布局（注意：不是用表格进行页面布局）中，除了 tr 和 td 之外，还有以下标签： 下面分别看一下这几个标签的作用及其相关属性： caption （标题），顾名思义，就是一个表格的标题。比如：本周股票行情、某班 2007 年下学期期末成绩表等。用法也很直观，即放在 table 标签之后：

<table> <caption>本周股票行情</caption> <!--其他表格标签--> </table> caption 标签没有什么特别的属性。它本身是一个块级元素，所以适用于块级元素的 CSS 样式也适用于 caption 元素，如：margin、padding 等。但同时，由于 caption 属性不能脱离 table 元素单独使用，所以 caption 属性也会继承 table 元素的样式属性（就和其他子元素从父元素继承样式一样）。 thead、tbody 和 tfoot 这三个标签也称为行组。因为这三个标签中都必须包含表格行－－ tr。其中，thead 中的 tr 表示的是表格标题行；tbody 中包含的 tr 则是表格数据行；而 tfoot 中包含的 tr 则是表格的表注行。在一个 HTML 表格中，只能有一个 thead 和 tfoot 元素，而且不管这两个元素在源代码中的位置如何，在 Web 页面中，thead 元素总是被解析为表格的第一行；类似地，tfoot 元素总是被解析为表格的最后一行。一个 HTML 表格中可以有多个 tbody 元素，每个 tbody 元素可以包含一或多个 tr 元素。这样，就可以通过 tbody 将多个数据行（tr）分为行组，为分别应用不同的样式提供方便。比如：

<table frame="hsides" rules="groups"> <caption>Sites that I like to visit</caption> <thead> <tr> <th scope="col">Person</th> <th scope="col">URL</th> </tr> </thead> <tfoot> <tr> <td colspan="2">[1] Enjoys Dance Dance Revolution</td> </tr> </tfoot> <tbody> <tr> <td>Bryan Veloso [1]</td> <td><a href="http://avalonstar.com/">Avalonstar</a></td> </tr> <tr> <td>Dan Rubin</td> <td><a href="http://superfluousbanter.org/"> SuperfluousBanter</a></td> </tr> </tbody> </table> 会得到如下表格：
Person URL
Bryan Veloso [1] Avalonstar
Dan Rubin SuperfluousBanter
注意，table 元素同时使用了 frame 和 rules 属性，其中 frame="hsides" 表示为表格上沿和下沿（水平方向）两条边加上边框，而 rules="groups" 则表示为表格中的分组（行组或列组）加边框。如上面所示，由 thead、tbody 和 tfoot 定义的三个行组之间被添加了边框。同时，在源代码中，tfoot 位于 tbody 标签之前，但显示结果仍然是表格的最后一行。 与行和行组（thead、tbody 及 tfoot）对应的，是列和列组。由于 HTML 表格是以行为中心的，所以仅从源代码中不容易发现列的“痕迹”，虽然可以用 tr 定义一行，但却没有相应的标签定义一列。事实上，HTML 表格中的列是由各个行中的单元格构成的。即每一行中的第一个单元格构成第一列，每一行中的第二个单元格构成第二列，依此类推。如前所述，通过以 tr 或者 tbody 作为 CSS 选择符，我们可以为表格中的一个或一组表格行应用不同的样式，如果要为某一列或几列应用独立的样式该怎么办呢？在讨论列和列组的概念之前，要实现这一点，只能靠为相应列的每个单元格应用相应的 class 属性实现，但这种方法显然不够灵活，而且相当麻烦。 HTML/XHTML 规范为此定义了 col 和 colgroup 标签，用于表示（不能像 tr 或 tbody 那样说是定义）一列或几列。这两个元素都可以使用 span 属性，表示跨越几列。比如：

<colgroup> <col /> <col /> </colgroup> <colgroup> <col /> <col /> <col /> </colgroup> 表示，将五列划分为两个列组，第一个列组由第一和第二列构成，第二个列组由余下的三列构成。如果使用 span 属性，以上代码也可以写成：

<colgroup span="2" /> <colgroup> <col span="2" /> <col /> </colgroup> 此时，第一个 colgroup 中的 span="2" 表示该列组包含两列；第二个列组的第一个 col 标签中的 span="2" 也表示两列，即第二个列组由三列构成。 下面看一个 col 和 colgroup 的例子。如下标记：

<table frame="vsides" rules="groups"> <colgroup span="2"> <colgroup> <col /> <col /> </colgroup> <tr> <td>colgroup1</td> <td>colgroup1</td> <td>colgroup2</td> <td>colgroup2</td> </tr> <tr> <td>colgroup1</td> <td>colgroup1</td> <td>colgroup2</td> <td>colgroup2</td> </tr> </table> 会生成如下样式的表格：
colgroup1 colgroup1 colgroup2 colgroup2
colgroup1 colgroup1 colgroup2 colgroup2
最后，在了解了如何生成表格行、表格列、行组以及列组后，还需要知道如何实现“合并单元格”的效果。在实践中，有的单元格需要跨越多列、或者跨越多行、或者同时跨越多列和多行。单元格以 td（或 th）定义，而跨行则由其 rowspan 属性指定，跨列由其 colspan 属性指定。如果一个单元格要跨越三行二列，那么应该写成：

<td rowspan="3" colspsan="2">

虽然理解起来有些不太直观，但只要对照以下示例代码和结果表格认真分析一下，就会明白了。

<table farme="border" rules="all"> <caption>Growth Chart</caption> <col width="60%"> <col width="20%"> <col width="20%"> <thead> <tr> <th scope="col">Name</th> <th scope="col">Age</th> <th scope="col">Height</th> </tr> </thead> <tfoot> <tr> <td colspan="3">[1] Has <a href="http://en.wikipedia.org/wiki/Gigantism"> Gigantism</a></td> </tr> </tfoot> <tbody> <tr> <th rowspan="3" align="left">Albert</th> <td>1</td> <td align="center">2 ft. 8 in.</td> </tr> <tr> <td>10</td> <td align="center">4 ft. 6 in.</td> </tr> <tr> <td>20</td> <td align="center">6 ft. 1 in.</td> </tr> </tbody> <tbody> <tr> <th rowspan="3" align="left">Betty [1]</th> <td>1</td> <td align="center">2 ft. 3 in.</td> </tr> <tr> <td>10</td> <td align="center">4 ft. 2 in.</td> </tr> <tr> <td>20</td> <td align="center">7 ft. 2 in.</td> </tr> </tbody> </table> 以上标记在 Web 页中生成的效果如下：
Growth Chart
Name Age Height
[1] Has Gigantism
Albert 1 2 ft. 8 in.
10 4 ft. 6 in.
20 6 ft. 1 in.
Betty [1] 1 2 ft. 3 in.
10 4 ft. 2 in.
20 7 ft. 2 in.