表格由<table> 標簽來定義。每個表格均有若干行（由 <tr> 標簽定義），每行被分割為若干單元格（由 <td> 標簽定義）。字母 td 指表格數據（table data），即數據單元格的內容。數據單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。
4.1 表格和邊框屬性
如果不定義邊框屬性，表格將不顯示邊框。有時這很有用，但是大多數時候，我們希望顯示邊框。使用邊框屬性來顯示一個帶有邊框的表格.
HTML
table定義和方法
簡單的HTML表格是有table元素以及一個或者多個hr、th、td元素組成-
HTML
<tr>定義和方法- 定義 HTML 表格中的行。
-tr 元素包含一個或多個 th 或 td 元素
- 定義 HTML 表格中的行。
HTML
<th>標簽的定義和用法定義表格內的表頭單元格
-
HTML表單有兩種類型的單元格
- 表頭單元格 - 包含表頭信息(由th元素創建)
- 標準單元格 - 包含數據（由td元素創建）
注意:之前一直沒有搞明白th和td的區別
th:居中的粗體文本
td:左對齊的普通文本
- 可選的屬性
| 屬性 | 值 | 描述 |
|---|---|---|
| align | left/center/right | 不贊成使用。請使用樣式代替,規定表格相對周圍元素的對齊方式。 |
| bgcolor | rgb(x,x,x) | 不贊成使用。請使用樣式代替.規定表格的背景顏色。 |
| border | pixels | 規定表格邊框的寬度。 |
| cellpadding | pixels/% | 規定單元邊沿與其內容之間的空白。 |
| cellspacing | pixels/% | 規定單元格之間的空白。 |
| frame | above/.../box/border | 規定外側邊框的哪個部分是可見的。 |
| rules | none/../rows/cols/all | 規定內側邊框的哪個部分是可見的。 |
| summary | text | 規定表格的摘要。 |
| width | %/pixels | 規定表格的寬度。 |
4.2 表頭
表格的表頭使用<th> 標簽進行定義。
大多數瀏覽器會把表頭顯示為粗體居中的文本：
4.3表格標簽圖示
| 表格 | 描述 |
|---|---|
<table> |
定義表格 |
<caption> |
表格中上方的文字,必須緊隨 table 標簽之后 |
<th> |
定義表格的表頭 |
<tr> |
定義表格的行 |
<td> |
定義表格單元 |
<thead> |
定義表格的頁眉 |
<tbody> |
定義表格的主體 |
<tfoot> |
定義表格的頁腳 |
<col> |
定義用于表格列的屬性 |
<colgroup> |
定義表格列的組 |
4.4 demo
<table border="2" cellpadding="5" bgcolor="#faebd7">
<caption>我的邊框</caption>
<tr>
<th>heading</th>
<th>Rowheader</th>
</tr>
<tr>
<td bgcolor="red">第一行</td>
<td>row</td>
</tr>
<tr>
<td> </td>
<td>row</td>
</tr>
</table><table border="2">
<caption>表格內的標簽</caption>
<tr>
<td>
<p>就是一個段落</p>
<p>這是另一個段落</p>
</td>
<td>
<table border="2">
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</table>
</td> </tr>
<tr>
<th>單元列表
<ul>
<li>水果</li>
<li>植物</li>
<li>動物</li>
</ul>
</th>
<td>Hello</td>
</tr></table>
<body>
</table><!--橫跨兩列的單元格--><table border="2">
<caption>橫跨兩列的單元格</caption>
<tr>
<th>姓名</th>
<th colspan="2">電話</th>
</tr>
<tr>
<td>張三</td>
<td>110110</td>
<td>120120</td>
</tr>
</table><!--橫跨兩行的單元格--><table border="2">
<caption>橫跨兩行的單元格</caption>
<tr>
<th>姓名</th>
<th>張三</th>
</th>
<tr>
<td rowspan="2">電話</td> <td>110110110110110</td>
</tr>
<tr>
<td>120120120120120</td>
</tr>
</body>
demo截圖：
Snip20160831_59.png
