close
<thead>應該拿來放表格的標題
<tbody>應該拿來放表格的內容
<tfoot>應該拿來放表格的註腳
※在預設值的情況下,瀏覽器輸出結果 與一般表格 無異
將<thead><tfoot>分開的原因:若表格超過螢幕高度(或印出來超過一頁)的話,瀏覽器會將標題和註腳保留不動,只捲動表格內容
(但目前仍未受到任何瀏覽器的預設支援)
原始碼:
<!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" />
</head>
<body>
<table width="200" border="0">
<thead>
<tr>
<th>日期(月)</th>
<th>數量</th>
<th>單價</th>
<th>金額</th>
</tr>
</thead>
<tbody>
<tr>
<td>2013/1</td>
<td>1</td>
<td>2</td>
<td>2</td>
</tr>
<tr>
<td>2013/2</td>
<td>2</td>
<td>2</td>
<td>4</td>
</tr>
<tr>
<td>2013/3</td>
<td>3</td>
<td>2</td>
<td>6</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>小計</td>
<td>6</td>
<td>2</td>
<td>12</td>
</tr>
</tfoot>
</table>
</body>
</html>
<!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" />
</head>
<body>
<table width="200" border="0">
<thead>
<tr>
<th>日期(月)</th>
<th>數量</th>
<th>單價</th>
<th>金額</th>
</tr>
</thead>
<tbody>
<tr>
<td>2013/1</td>
<td>1</td>
<td>2</td>
<td>2</td>
</tr>
<tr>
<td>2013/2</td>
<td>2</td>
<td>2</td>
<td>4</td>
</tr>
<tr>
<td>2013/3</td>
<td>3</td>
<td>2</td>
<td>6</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>小計</td>
<td>6</td>
<td>2</td>
<td>12</td>
</tr>
</tfoot>
</table>
</body>
</html>
輸出畫面:
全站熱搜
留言列表