表格和邊框屬性, 表格表頭單元格，表格標題<caption>，表格高度和寬度，表格背景，表格空間，合併單元格，表格頭部、主體、頁腳,定義表格,定義表格的行,定義表格列的組定義用於表格列的屬性,定義表格的頁眉,定義表格的主體定義表格的頁腳<table><tbody><tr><th>\定義表格的表頭,<... ...
表格由<table>標簽來定義,每個表格均有若幹行（由<tr>標簽定義），每行被分割為若幹單元格（由<td>標簽定義）。字母 td 指表格數據（table data），即數據單元格的內容。數據單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。
1 HTML 表格的基本結構： 2 <table>…</table>：定義表格 3 <th>…</th>：定義表格的標題欄（文字加粗） 4 <tr>…</tr>：定義表格的行 5 <td>…</td>：定義表格的列
HTML 表格和邊框屬性,如果不定義邊框屬性，表格將不顯示邊框。有時這很有用，但是大多數時候，我們希望顯示邊框,使用邊框屬性border來顯示一個帶有邊框的表格：
1 <table border="1"> 2 <tr> 3 <td>Row 1, cell 1</td> 4 <td>Row 1, cell 2</td> 5 </tr> 6 </table>
HTML 表格表頭單元格:表格的表頭單元格使用<th>標簽進行定義;表格的表頭單元格屬性主要是一些公共屬性，如：align、dir、width、height。 大多數瀏覽器會把表頭顯示為粗體居中的文本：
1 <table border="1"> 2 <tr> 3 <th>Header 1</th> 4 <th>Header 2</th> 5 </tr> 6 <tr> 7 <td>row 1, cell 1</td> 8 <td>row 1, cell 2</td> 9 </tr> 10 <tr> 11 <td>row 2, cell 1</td> 12 <td>row 2, cell 2</td> 13 </tr> 14 </table>
表格標題<caption>:在<table>標簽中我們可以使用<caption> ... </ caption>標簽作為標題，併在表的頂部顯示出來*此標簽在較新版本的HTML / XHTML中已棄用
1 table border = "1"> 2 <caption>這是標題</caption> 3 <tr> 4 <td>row 1, column 1</td><td>row 1, columnn 2</td> 5 </tr> 6 <tr> 7 <td>row 2, column 1</td><td>row 2, columnn 2</td> 8 </tr> 9 </table>
HTML表格高度和寬度:在<table>標簽中您可以使用width（寬）和height（高）屬性設置表格寬度和高度。您可以按像素或可用屏幕區域的百分比來指定表格寬度或高度。
1 <table border = "1" width = "400" height = "150"> 2 <tr> 3 <td>Row 1, Column 1</td> 4 <td>Row 1, Column 2</td> 5 </tr> 6 <tr> 7 <td>Row 2, Column 1</td> 8 <td>Row 2, Column 2</td> 9 </tr> 10 </table>
HTML表格背景:您可以使用以下方法之一設置HTML表格的背景,HTML5中不推薦使用bgcolor，background和bordercolor屬性,不要使用這些屬性:
- bgcolor屬性 - 可以為整個表格或僅為一個單元格設置背景顏色。
- background屬性 - 可以為整個表設置背景圖像或僅為一個單元設置背景圖像
- bordercolor屬性 - 可以設置邊框顏色。
1 <body> 2 <table border = "1" bordercolor = "green" bgcolor = "yellow"> 3 <tr> 4 <th>Column 1</th> 5 <th>Column 2</th> 6 <th>Column 3</th> 7 </tr> 8 </table> 9 <!-- 使用background屬性需要提供圖像 URL 地址--> 10 <table border = "1" bordercolor = "green" background = "/images/test.png"> 11 <tr> 12 <th>Column 1</th> 13 <th>Column 2</th> 14 <th>Column 3</th> 15 </tr> 16 </table> 17 </body>
HTML表格空間:cellspacing屬性-定義表格單元格之間的空間 ,cellpadding屬性-表示單元格邊框與單元格內容之間的距離
1 <table border = "1" cellpadding = "5" cellspacing = "5"> 2 <tr> 3 <th>Name</th> 4 <th>Salary</th> 5 </tr> 6 <tr> 7 <td>其琛</td> 8 <td>5000</td> 9 </tr> 10 <tr> 11 <td>曼迪</td> 12 <td>7000</td> 13 </tr> 14 </table>
HTML合併單元格:如果要將兩個或多個列合併為一個列，將使用colspan屬性;如果要合併兩行或更多行，則將使用rowspan屬性。
1 <table border = "1"> 2 <tr> 3 <th>Column 1</th> 4 <th>Column 2</th> 5 <th>Column 3</th> 6 </tr> 7 <tr> 8 <td rowspan = "2">Row 1 Cell 1</td> 9 <td>Row 1 Cell 2</td> 10 <td>Row 1 Cell 3</td> 11 </tr> 12 <tr> 13 <td>Row 2 Cell 2</td> 14 <td>Row 2 Cell 3</td> 15 </tr> 16 <tr> 17 <td colspan = "3">Row 3 Cell 1</td> 18 </tr> 19 </table>
HTML表格頭部、主體、頁腳:表格可以分為三個部分 - 頭部，主體和頁腳，如同word文檔中頁面的頁眉、正文、頁腳。每個頁面保持相同，而正文是表格的主要內容持有者。頭部，主體和頁腳的對應的三個標簽是：
- <thead> - 創建單獨的表頭
- <tbody> - 表示表格的主體
- <tfoot> - 創建一個單獨的表頁腳
表可以包含多個<tbody>元素以指示不同的頁面,但值得註意的是<thead>和<tfoot>標簽應出現在<tbody>之前
1 <table border = "1" width = "100%"> 2 <thead> 3 <tr> 4 <td colspan = "4">This is the head of the table</td> 5 </tr> 6 </thead> 7 8 <tfoot> 9 <tr> 10 <td colspan = "4">This is the foot of the table</td> 11 </tr> 12 </tfoot> 13 14 <tbody> 15 <tr> 16 <td>Cell 1</td> 17 <td>Cell 2</td> 18 <td>Cell 3</td> 19 <td>Cell 4</td> 20 </tr> 21 </tbody> 22 </table>
HTML表格的嵌套,您可以在另一個表中使用一個表。可以使用<table>內的幾乎所有標簽。
