HTML 表格（Tables）
HTML 表格例子:
| Firstname | Lastname | Points |
|---|---|---|
| Jack | Woo | 90 |
| Eve | Jackson | 94 |
| John | Doe | 80 |
| Adam | Johnson | 67 |
亲自试一试 - 例子
基本的表格
示例演示了如何创建一个基本的表格
有边框的表格
示例演示了如何给表格添加边框
收缩边框的表格
示例演示了如何创建收缩的边框的表格
HTML 表格（Tables）
表单的定义表示是 <table>
表格由行组成，标签是 <tr> (tr是table row的缩写)
行内可以分割成数据单元格列，标签是 <td> (td是table data的缩写)
行也可以分割成标题列，标签是 <th> (th是table heading的缩写)
<td> 元素是在表格用于存放数据
<td> 元素可以包含各种各样的HTML元素，像文本，图片，列表，其他表格等.
表格的宽度可以使用css定义.
例子
<tr>
<td>Jack</td>
<td>Woo</td>
<td>90</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
亲自试一试 »
带边框（border）的表格
如果你没有为表格指定边框，表格就不会显示边框.
边框可以通过border属性添加：
例子
<tr>
<td>Jack</td>
<td>Woo</td>
<td>90</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
亲自试一试 »
|
不过，border属性在HTML标准中已经不建议属性
However, the border attribute is on its way out of the HTML standard!
最好使用CSS样式 |
|---|
使用Css添加边框，需要使用border属性：
定义边框时，需要对表格和单元格同时定义.
收缩边框的表格
如果你想把表格收缩成一个边框边界，使用css中的border-collapse属性：
带内边距的表格
内边距指单元格中的内容与边框之间的距离.
如果你没有指定内边距，单元格将不显示内边距.
可以使用CSS的padding属性设置内边距:
表格标题（heading）
表格的标题使用 <th> 标签定义.
默认情况下，所有的主流浏览器显示标题标题的样式都是粗体和居中：
例子
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Points</th>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
亲自试一试 »
如果想让表格标题居左对齐，需要使用CSS中的text-align属性：
单元格间距：
单元格间距是指单元格间的距离.
使用CSS中的border-spacing的属性设置单元格间距:
更多例子
设置水平/垂直的表格标题
示例演示了如何创建水平/垂直的表格标题.
表格说明
示例演示了如何给表格添加说明.
单元格中行/列的合并和拆分
示例演示了如何定义合并或拆分单元格.
表格内的标签
示例演示了如何在表格中放置其他元素.
