table
HTML及CSS語法簡易教學
<table> </table> 表格標記,用來標示一個表格的範圍。
<tbody> </tbody> 表格本體標記,用來標示一個表格本體的範圍。
<tr> </tr> 表格列標記,用來標記一個列。
<td> </td> 儲存格標記,用來標記一個儲存格。
width 設定寬度 *CSS不適用
height 設定高度 *CSS不適用
align 水平對齊方式:left左、center中、right右、justity分散對齊 *CSS不適用
valign 垂直對齊方式:top上、middle中、bottom下、baseline基準線 *CSS不適用
border 外框線寬度
cellpadding 儲存格與其內容之間隔值
cellspacing 儲存格間的間隔值
rowspan 直行合併
colspan 橫列合併
CSS語法:
text-align: center;
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>
結果為: