TBODY, TFOOT, THEAD

TBODY 可將數個橫欄結合成一組，尤其是相似性質的欄。

THEAD 產生表頭；例如，欄位名稱。

TFOOD 產生表尾：報表製作日期，公司部門等等。

當報表很長時，THEAD 與 TFOOD 可以顯示在每一頁上。一份報表只能有一個 THEAD 及一個 TFOOT，但可以有多個 TBODY。

可以用 javascript 的 table 物件，動態調整報表。

屬性說明
ALIGN | CHAR | CHAROFF | VALIGN
通用屬性 此元件可以使用通用屬性，請參考通用屬性的說明。
ALIGN 設定資料在方格中對齊的方法。可設為： left：資料對齊方格的左邊。此為預設值。 center：資料展現於方格的中央。此為表頭的預設值。 right：資料對齊方格的右邊。 justify：兩邊對齊。IE 未支援此功能；Firefox, Safari, Chrome 支援成功。 char：資料依據指定的字對齊。主要瀏覽器都不支援此功能。

<table width=400 style='background:#aaaa66' rules=all frame=box> <caption>ALIGN 範例</caption> <thead align=center><tr><th>名人名言 </thead> <tbody align=right> <tr><td>靠右 Not ask what your country can do for you, ask what you can do for your country. </tbody> <tbody align=justify> <tr><td>兩邊排齊 Not ask what your country can do for you, ask what you can do for your country. </tbody> <tfoot align=right><tr><td>報表日期：民國九十七年十一月八日 </tfoot> </table>

• 範例：

  <table width=400 style='background:#aaaa66' rules=all frame=box>
  <caption>ALIGN 範例</caption>
  <thead align=center><tr><th>名人名言
  </thead>
  <tbody align=right>
  <tr><td>靠右 Not ask what your country can do for you, ask what you can do for your country.
  </tbody>
  <tbody align=justify>
  <tr><td>兩邊排齊 Not ask what your country can do for you, ask what you can do for your country.
  </tbody>
  <tfoot align=right><tr><td>報表日期：民國九十七年十一月八日
  </tfoot>
  </table>
  

• 執行結果：

  ALIGN 範例

  名人名言
  靠右 Not ask what your country can do for you, ask what you can do for your country.
  兩邊排齊 Not ask what your country can do for you, ask what you can do for your country.
  報表日期：民國九十七年十一月八日

CHAR 當 align='char' 時，用來宣告直欄的對齊字。預設值，在英語為數字的小數點『.』，法語則為『,』。CHAR 與 CHAROFF 沒有瀏覽器支援。

<table width=200 style='background:#aaaa66' rules=all frame=box> <tbody align='char' char='.'> <tr><td>11.4 <tr><td>0.8 <tr><td>100.345 </tbody> </table>

• 範例：

  <table width=200 style='background:#aaaa66' rules=all frame=box>
  <tbody align='char' char='.'>
  <tr><td>11.4
  <tr><td>0.8
  <tr><td>100.345
  </tbody>
  </table>
  

• 執行結果：

  11.4

  0.8

  100.345

CHAROFF 設定距離第一個對齊字的長度，單位可用像素或百分比。

<table width=150 style='background:#aaaa66' rules=all frame=box> <tbody align='char' char='.' charoff=1> <tr><td>11.4 <tr><td>0.8 <tr><td>100.34 </tbody> </table>

• 範例：

  <table width=150 style='background:#aaaa66' rules=all frame=box>
  <tbody align='char' char='.' charoff=1>
  <tr><td>11.4
  <tr><td>0.8
  <tr><td>100.34
  </tbody>
  </table>
  

• 執行結果：

  11.4

  0.8

  100.34

VALIGN 指定資料放置在方格中的垂直位置。可設為： top：資料放在方格上方。 middle: 資料放在方格的垂直中央。此為預設值。 bottom：資料放在方格的底部。 baseline：資料的第一行（只有第一行）文字行，要放在同一橫列的基準線上。

<table width=200 style='background:#aaaa66' rules=all frame=box> <tbody valign=top> <tr><td>示範<br>2<br>3<td>上方 </tbody> <tbody valign=middle> <tr><td>示範<br>2<br>3<td>中央 </tbody> <tbody valign=bottom> <tr><td>示範<br>2<br>3<td>底部 </tbody> <tbody valign=baseline> <tr><td>示範<br>2<br>3<td>基準線<br>1 </tbody> </table>

• 範例：

  <table width=200 style='background:#aaaa66' rules=all frame=box>
  <tbody valign=top>
  <tr><td>示範<br>2<br>3<td>上方
  </tbody>
  <tbody valign=middle>
  <tr><td>示範<br>2<br>3<td>中央
  </tbody>
  <tbody valign=bottom>
  <tr><td>示範<br>2<br>3<td>底部
  </tbody>
  <tbody valign=baseline>
  <tr><td>示範<br>2<br>3<td>基準線<br>1
  </tbody>
  </table>
  

• 執行結果：

  示範 2 3	上方
  示範 2 3	中央
  示範 2 3	底部
  示範 2 3	基準線 1