<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>關於表格的一些練習</title> 注釋：2、<tbody>…</tbody>：當表格內容非常多時，表格會下載一點顯示一點，但如果加上<tbody>標簽后（在table標簽里包括），這個表格就要等表格內容全部下載完才會顯示
</head>
<body>
<p>一個普通基本的表格</p>
<table border="5" bgcolor="#ffe4c4" background="sun.html" cellpadding="10" cellspacing="10" width="100%" height="200px">
<h2>以上屬性依次為 邊框寬度 背景色 背景圖案 字符距邊框距離 邊框間距 表格寬度 表格像素大小</h2>
<caption>我的標題</caption> 注釋：這是表格標題元素
<tr background="blue">
<th align="left">姓名</th>
<th align="right">電話</th> 注釋：表格格式是行元素標簽<tr>包括列元素標簽<td>其中一種特殊的表頭元素標簽<th>作為基本的元素標簽優先級與列元素標簽相同
<th align="">電話</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<p>一個帶有頁眉頁腳的表格</p>
<table border="1"> <!--頁眉（thead）頁腳(tfoot)和（tbody）必須一起使用-->
<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>
<h4>橫跨兩列的單元格：</h4>
<table border="1">
<tr>
<th>姓名</th>
<th colspan="2">電話</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<h4>橫跨兩行的單元格：</h4>
<table border="1">
<tr>
<th>姓名</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">電話</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>
</body>
</html>
表格標簽中的定義表格列組屬性的標簽<colgroup> 與其類似的定義一個或多個列的屬性標簽<col>
兩個 colgroup 元素為表格中的三列規定了不同的對齊方式和樣式（注意第一個 colgroup 元素橫跨兩列）：
<table width="100%" border="1">
<colgroup span="2" align="left"></colgroup>
<colgroup align="right" style="color:#0000FF;"></colgroup>
<tr>
<th>ISBN</th>
<th>Title</th>
<th>Price</th>
</tr>
<tr>
<td>3476896</td>
<td>My first HTML</td>
<td>$53</td>
</tr>
</table>
親自試一試
瀏覽器支持
