表格是每一個網頁不可缺少的東西,首先我們要加入<table>的碼,在<table>的標籤內可以控制整個表格的長度和外框的粗細 :
<table width="300 border="1 cellspacing="2>
- width=控制表格長度,可用數字或百分比
- cellspaing=控制儲存格的分隔距離,內定為2
- background=背景圖檔
- border=控制外框粗細,不外框便設成0
這只是一開始的設定,必須在<table>後加上<td>,才會新開一個儲存格,再用</td>來關閉儲存格 :
<table border=1> <td>儲存格1</td> <td>儲存格2</td> </table> |
若想跳到下一行,加上<tr>即可 :
<table border=1> <td>儲存格1</td> <td>儲存格2</td> <tr> <td>儲存格3</td> <td>儲存格4</td> </table> |
當然亦可使用<th>:
<table border=1> <th>儲存格1</th> <th>儲存格2</th> <tr> <td>儲存格3</td> <td>儲存格4</td> </table> |
<td><th>內的屬性如下 :
- align=控制水平是left(靠左)/right(靠右)/center(置中)
- valign=控制垂直是top(靠上)/middle(置中)/bottom(靠下)
- background=背景圖檔
- colspan=使一個儲存格橫跨 N 個欄位
- rowspan=使一個儲存格下跨 N 個列
若想為表格加上標題,來標明整個表格的主題,可在<table>後加上<caption>的標籤
<table border=1> <caption>公佈欄</caption> <td>儲存格1</td> <td>儲存格2</td> <tr> <td>儲存格3</td> <td>儲存格4</td> </table> |
colspan的用法 :
<table border=1> <td colspan=3 align=center>儲存格 A1</td> <tr> <td>儲存格 B1</td> <td>儲存格 B2</td> <td>儲存格 B3</td> </table> |
rowspan的用法 :
<table border=1> <td rowspan=3 align=center>儲存格 A1</td> <td>儲存格 B1</td> <tr> <td>儲存格 B2</td> <tr> <td>儲存格 B3</td> </table> |