<table>標簽
HTML中表格由 <table> 標簽來定義。
每個表格均有若干行(由 <tr> 標簽定義),每行被分割為若干單元格(由 <td> 標簽定義)。<td>標簽中表示內容,即數據單元格的內容。數據單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等。
<table>標簽的基本格式
<table> <tr> <th></th> <th></th> </tr> <tr> <td></td> <td></td> </tr> </table>
功能: <table>…</table>用來聲明表格開始與結束.
<tr>…</tr>用來設置表格的行.
<th>…</th>用來設置標題欄位.
<td>…</td>用來設置數據欄位.
<table>標簽下的屬性
屬性 |
屬性值 |
說明 |
border |
像素 |
表格邊框寬度 |
height |
像素、百分比 |
表格整體高度 |
width |
像素、百分比 |
表格整體寬度 |
cellpadding |
像素、百分比 |
邊框與單元格的距離 |
cellspacing |
像素、百分比 |
單元格邊框寬度 |
align |
Left、center、right |
對齊方式 |
bgcolor |
英文、16進制、rgba |
表格背景顏色 |
background |
url |
表格的背景圖片 |
<tr><th><td>標簽下的常用屬性
屬性 |
屬性值 |
說明 |
width |
像素、百分比 |
設置單元格的寬 |
height |
像素、百分比 |
設置單元格的高 |
align |
Left、center、right |
水平移動 |
valign |
Top、middle、bottom |
垂直移動 |
nowrap |
無 |
在單元格中換行 |
查分合並單元格
屬性 |
屬性值 |
說明 |
colspan |
數字(占據的列數) |
由左向右擴展 |
rowspan |
數字(占據的行數) |
由上向下擴展 |
注意:合並單元格時,需要刪除所占用位置的代碼
表格的結構化、標題
1.結構化格式:
<table>
<thead>……</thead> --------表頭區
<tbody>……</tbody> --------表體區
………………
<tfoot>……</tfoot> --------表尾區
</table>
2.表格的標題(只能有一個):
<table>
<caption>標題內容</caption>
</table>
<caption>標簽下的屬性值有:
屬性名 | 屬性值 | 說明 |
align | top | 標題在表格上方 |
bottom | 標題在表格下方 |