table

HTML及CSS語法簡易教學

    1. <table> </table> 表格標記,用來標示一個表格的範圍。

    2. <tbody> </tbody> 表格本體標記,用來標示一個表格本體的範圍。

    3. <tr> </tr> 表格列標記,用來標記一個列。

    4. <td> </td> 儲存格標記,用來標記一個儲存格。

    5. width 設定寬度 *CSS不適用

    6. height 設定高度 *CSS不適用

    7. align 水平對齊方式:left左、center中、right右、justity分散對齊 *CSS不適用

    8. valign 垂直對齊方式:top上、middle中、bottom下、baseline基準線 *CSS不適用

    9. border 外框線寬度

    10. cellpadding 儲存格與其內容之間隔值

    11. cellspacing 儲存格間的間隔值

    12. rowspan 直行合併

    13. colspan 橫列合併

CSS語法:

    1. text-align: center;

  1. vertical-align: middle;

舉例:

<table style="border-width: 1px; margin-left: 5em; width: 80%; float: none;" border="1" cellpadding="1" cellspacing="1">

<tbody>

<tr>

<td style="width: 10%; text-align: center;">1-1</td>

<td style="width: 50%; text-align: center;">1-2</td>

<td style="width: 20%; text-align: center;>1-3</td>

<td style="width: 20%; text-align: center;>1-4</td>

</tr>

<tr>

<td align="center">2-1</td>

<td valign="top" align="left">2-2</td>

<td valign="top" align="left">2-3</td>

<td valign="top" align="left">2-4</td>

</tr>

<tr>

<td align="center">3-1</td>

<td valign="top" align="left">3-2</td>

<td valign="top" align="left">3-3</td>

<td valign="top" align="left">3-4</td>

</tr>

</tbody>

</table>

結果為:

參考資料來源:http://www.tienti.tw/?q=node/240