教程列表

html 表格

HTML 有 10 个表格相关标签。下面是一个带有简介的列表，但是首先，文档要被正确的定义在 HTML 4.01/XHTML 1 或 HTML 5 下面：

<caption> 定义表格标题 (4, 5)
<col> 为表格的列定义属性 (4, 5)
<colgroup> 定义表格列的分组 (4, 5)
<table> 定义表格 (4, 5)
<tbody> 定义表格主体 (4, 5)
<td> 定义一个单元格 (4, 5)
<tfoot> 定义表格的表注（底部）(4, 5)
<th> 定义表格的表头 (4, 5)
<thead> 定义表格的表头 (4, 5)
<tr> 定义表格的行 (4, 5)

一个基本的表格结构图

它包含一个标题、头部、主体和底部。正确的 HTML 元素顺序是：

你也可以使用<col> 和<colgroup> 来定义表格的列或为列分组：

下面是一个正确的表格结构实例：

根据 w3schools 的解释和用法，在一个 table 定义中，<tfoot>元素必须出现在<tbody>之前，这样，浏览器就可以在接受到所有数据之前呈现表注了。另外，如果不是这个顺序，将不能通过 W3C 的 HTML4 和 XHTML 验证，无论你声明哪种 DTD。（了解更多）。

在 HTML 4.01 中，表格的 align 和 bgcolor 属性不赞成使用，所以在 HTML 5 中不再有任何 table 的属性被支持（事实上，在 XHTML 1.0 Strict DTD 中已经不支持 align 和 bgcolor 属性了）；

所有主流浏览器都支持<colgroup> 标签，但是 Firefox、Chrome 以及 Safari 仅支持 colgroup 元素的 span 和 width 属性；

css 中的 empty-cells:show|hide 可以设定空单元格是否显示边框。注意，这个需要设置在 table 而不是 td/th 中。IE6 中比较容易遇到该问题；

css 中的 border-collapse:collapse | separate 可以设置表格的边框是否被合并成一个边框；

css 中的 border-spacing 属性等效于 table 的 cellspacing 属性。

为了实现现在所提倡的表现和结构分离的开发模式，前端观察建议将页面中所有与表现层有关的东东，都用 CSS 来控制，不用 HTML 自带的属性来控制页面的表现，而 table 是最容易被忽略的一个。