<table> 標簽定義 HTML 表格。簡單的 HTML 表格由 table 元素以及一個或多個 tr、th 或 td 元素組成。tr 元素定義表格行，th 元素定義表頭，td 元素定義表格單元。更復雜的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。
table標簽除了具有html元素中通用的屬性外，還含有自己的屬性，常用屬性如下：
bgcolor：規定表格邊框的寬度。
cellpadding：規定單元邊沿與其內容之間的空白
cellspacing：規定單元格之間的空白。
frame：規定外側邊框的哪個部分是可見的。
rules：規定內側邊框的哪個部分是可見的。
summary：規定表格的摘要。
width：規定表格的寬度。
1、<thead> 標簽
<thead> 標簽定義表格的表頭。該標簽用於組合 HTML 表格的表頭內容。thead 元素應該與 tbody 和 tfoot 元素結合起來使用。tbody 元素用於對 HTML 表格中的主體內容進行分組，而 tfoot 元素用於對 HTML 表格中的表注（頁腳）內容進行分組。在默認情況下這些元素不會影響到表格的布局。不過，您可以使用 CSS 使這些元素改變表格的外觀。
描述：thead、tfoot 以及 tbody 元素使您有能力對表格中的行進行分組。當您創建某個表格時，您也許希望擁有一個標題行，一些帶有數據的行，以及位於底部的一個總計行。這種划分使瀏覽器有能力支持獨立於表格標題和頁腳的表格正文滾動。當長的表格被打印時，表格的表頭和頁腳可被打印在包含表格數據的每張頁面上。
常用屬性如下：
align：定義 thead 元素中內容的對齊方式。
char：規定根據哪個字符來進行文本對齊。
charoff：規定第一個對齊字符的偏移量。
valign：規定 thead 元素中內容的垂直對齊方式。
注意：<thead> 內部必須擁有 <tr> 標簽！
源碼如下：
<table border="1"> <thead> <tr> <th>Month</th> <th>Savings</th> </tr> </thead> <tfoot> <tr> <td>Sum</td> <td>$180</td> </tr> </tfoot> <tbody> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$80</td> </tr> </tbody> </table>
2、<tbody> 標簽
<tbody> 標簽表格主體（正文）。該標簽用於組合 HTML 表格的主體內容。
常用屬性如下：
align：定義 thead 元素中內容的對齊方式。
char：規定根據哪個字符來進行文本對齊。
charoff：規定第一個對齊字符的偏移量。
valign：規定 thead 元素中內容的垂直對齊方式。
<table border="1"> <thead> <tr> <th>Month</th> <th>Savings</th> </tr> </thead> <tfoot> <tr> <td>Sum</td> <td>$180</td> </tr> </tfoot> <tbody> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$80</td> </tr> </tbody> </table>
3、<tfoot> 標簽
<tfoot> 標簽定義表格的頁腳（腳注或表注）。該標簽用於組合 HTML 表格中的表注內容。
常用屬性如下：
align：定義 thead 元素中內容的對齊方式。
char：規定根據哪個字符來進行文本對齊。
charoff：規定第一個對齊字符的偏移量。
valign：規定 thead 元素中內容的垂直對齊方式。
<table border="1"> <thead> <tr> <th>Month</th> <th>Savings</th> </tr> </thead> <tfoot> <tr> <td>Sum</td> <td>$180</td> </tr> </tfoot> <tbody> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$80</td> </tr> </tbody> </table>
4、<tr> 標簽
<tr> 標簽定義 HTML 表格中的行。tr 元素包含一個或多個 th 或 td 元素。
常用屬性如下：
align：定義 thead 元素中內容的對齊方式。
char：規定根據哪個字符來進行文本對齊。
charoff：規定第一個對齊字符的偏移量。
valign：規定 thead 元素中內容的垂直對齊方式。
<table border="1"> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table>
5、<th> 標簽
<th> 標簽定義表格內的表頭單元格。
HTML 表單中有兩種類型的單元格：
- 表頭單元格 - 包含表頭信息（由 th 元素創建）
- 標准單元格 - 包含數據（由 td 元素創建）
th 元素內部的文本通常會呈現為居中的粗體文本，而 td 元素內的文本通常是左對齊的普通文本。
常用屬性如下：
align：規定單元格內容的水平對齊方式。
char：規定根據哪個字符來進行文本對齊。
charoff：規定第一個對齊字符的偏移量。
colspan：設置單元格可橫跨的列數。
rowspan：規定單元格可橫跨的行數。
valign：規定單元格內容的垂直排列方式。
6、<td> 標簽
定義 HTML 表格中的標准單元格。
常用屬性如下：
align：規定單元格內容的水平對齊方式。
char：規定根據哪個字符來進行文本對齊。
charoff：規定第一個對齊字符的偏移量。
colspan：設置單元格可橫跨的列數。
rowspan：規定單元格可橫跨的行數。
valign：規定單元格內容的垂直排列方式。
綜合實例：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Book List</title> <style type="text/css"> table { background-color: #FFF; border: none; color: #565; font: 12px arial; } table caption { font-size: 24px; border-bottom: 2px solid #B3DE94; border-top: 2px solid #B3DE94; } table, td, th { margin: 0; padding: 0; vertical-align: middle; text-align:left; } tbody td, tbody th { background-color: #DFC; border-bottom: 2px solid #B3DE94; border-top: 3px solid #FFFFFF; padding: 9px; } tfoot td, tfoot th { font-weight: bold; padding: 4px 8px 6px 9px; text-align:center; } thead th { font-size: 14px; font-weight: bold; line-height: 19px; padding: 0 8px 2px; text-align:center; } tbody tr.odd th,tbody tr.odd td { /*odd就是偶數行*/ background-color: #CEA; border-bottom: 2px solid #67BD2A; } td+td+td, /*第三個td以及之后的td元素*/ col.price{ /*類樣式*/ text-align:right; } tbody tr:hover td, tbody tr:hover th { /*tr也有hover樣式*/ background-color: #8b7; color:#fff; } </style> </head> <body> <table summary="book list"> <caption>Book List</caption> <!-- caption 標簽必須緊隨 table 標簽之后。您只能對每個表格定義一個標題。通常這個標題會被居中於表格之上。 --> <col></col><col></col><col></col><col class="price" align="right"></col><col></col> <thead> <tr> <th >Title</th> <th >ID</th> <th >Country</th> <th >Price</th> <th >Download</th> </tr> </thead> <tbody> <tr > <th >Tom</th> <td>1213456</td> <td>Germany</td> <td>$3.12</td> <td>Download</td> </tr> <tr class="odd"> <th >Chance</th> <td>1213457</td> <td>Germany</td> <td>$123.34</td> <td>Download</td> </tr> <tr > <th >John</th> <td>1213458</td> <td>Germany</td> <td>$34.37</td> <td>Download</td> </tr> <tr class="odd"> <th >oKathleen</th> <td>1213459</td> <td>Germany</td> <td>$23.67</td> <td>Download</td> </tr> </tbody> <tfoot> <tr> <th >Total</th> <td colspan="4">4 books</td> </tr> </tfoot> </table> </body> </html>