3.5 表格標(biāo)簽 2011/7/26
3.5 表格標(biāo)簽 2011/7/26
|
表格
|
描述
|
|
|
定義表格
|
|
|
定義表格標(biāo)題。
|
|
|
定義表格的表頭。
|
|
|
定義表格的行。
|
|
|
定義表格單元。
|
|
|
定義表格的頁眉。
|
|
|
定義表格的主體。
|
|
|
定義表格的頁腳。
|
|
|
定義用于表格列的屬性。
|
|
|
定義表格列的組。
|
代碼舉例:
<body>
<table border="1">
<tr>
<td> <p> 這是一個段落。</p> <p>這是另一個段落。</p> </td>
<td>這個單元包含一個表格：
<table border="1">
<tr> <td>A</td> <td>B</td> </tr>
<tr> <td>C</td> <td>D</td> </tr>
</table>
</td>
</tr>
<tr>
<td>這個單元包含一個列表：
<ul> <li>蘋果</li> <li>香蕉</li> <li>菠蘿</li> </ul>
</td>
<td>HELLO</td>
</tr>
</table>
</body>
|
網(wǎng)頁效果:
<html>
<body>
<p>每個表格由table 標(biāo)簽開始。</p>
<p>每個表格行由tr 標(biāo)簽開始。</p>
<p>每個表格數(shù)據(jù)由td 標(biāo)簽開始。</p>
<h4>一列：</h4>
<table border="1">
<tr>
<td>100</td>
</tr>
</table>
<h4>一行三列：</h4>
<table border="1">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
</table>
<h4>兩行三列：</h4>
<table border="1">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
</body>
</html>
這個例子演示如何在HTML 文檔中創(chuàng)建表格:
表格邊框
<html>
<body>
<h4>帶有普通的邊框：</h4>
<table border="1">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>帶有粗的邊框：</h4>
<table border="8">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>帶有很粗的邊框：</h4>
<table border="15">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
</body>
</html>
本例演示各種類型的表格邊框:
表格
表格由<table> 標(biāo)簽來定義。每個表格均有若干行（由<tr> 標(biāo)簽定義），每行被分割為若干單元格
（由<td> 標(biāo)簽定義）。字母td 指表格數(shù)據(jù)（table data），即數(shù)據(jù)單元格的內(nèi)容。數(shù)據(jù)單元格可以
包含文本、圖片、列表、段落、表單、水平線、表格等等。
<table border="1"><tr><td>row 1, cell 1</td><td>row 1, cell
2</td></tr><tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr></table>
在瀏覽器顯示如下：
row 1, cell 1 row 1, cell 2
row 2, cell 1 row 2, cell 2
表格和邊框?qū)傩?/span>
如果不定義邊框?qū)傩�，表格將不顯示邊框。有時這很有用，但是大多數(shù)時候，我們希望顯示邊框。
使用邊框?qū)傩詠盹@示一個帶有邊框的表格
<table border="1"><tr><td>Row 1, cell 1</td><td>Row 1, cell
2</td></tr></table>
表格的'表頭
表格的表頭使用<th> 標(biāo)簽進行定義。
<table border="1"><tr><th>Heading</th><th>Another
Heading</th></tr><tr><td>row 1, cell 1</td><td>row 1, cell
2</td></tr><tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr></table>
在瀏覽器顯示如下：
Heading Another Heading
row 1, cell 1 row 1, cell 2
row 2, cell 1 row 2, cell 2
表格中的空單元格
在大多數(shù)瀏覽器中，沒有內(nèi)容的表格單元顯示得不太好。
<table border="1"><tr><td>row 1, cell 1</td><td>row 1, cell
2</td></tr><tr><td>row 2, cell 1</td><td></td></tr></table>
在瀏覽器顯示如下：
row 1, cell 1 row 1, cell 2
row 2, cell 1
注意：這個空的單元格的邊框沒有被顯示出來。（不過Mozilla Firefox 可以將整個邊框顯示出來。）為了
避免這種情況，在空單元格中添加一個空格占位符，就可以將邊框顯示出來。
<table border="1"><tr><td>row 1, cell 1</td><td>row 1, cell
2</td></tr><tr><td>row 2, cell 1</td><td> </td></tr></table>
在瀏覽器中顯示如下：
row 1, cell 1 row 1, cell 2
row 2, cell 1
表格標(biāo)簽
表格描述
<table> 定義表格
<caption> 定義表格標(biāo)題。
<th> 定義表格的表頭。
<tr> 定義表格的行。
<td> 定義表格單元。
<thead> 定義表格的頁眉。
<tbody> 定義表格的主體。
<tfoot> 定義表格的頁腳。
<col> 定義用于表格列的屬性。
<colgroup> 定義表格列的組。
【3.5 表格標(biāo)簽 2011/7/26】相關(guān)文章：
1.3.3 表單標(biāo)簽 2011/7/25
2.3.4 列表標(biāo)簽 2011/7/25
3.3.1 基本的HTML標(biāo)簽 2011/7/24
4.第三章 html標(biāo)簽 2011/7/24
5.第五章 框架（重點一） 2011/7/26
6.標(biāo)簽
7.3.5學(xué)雷鋒日隨筆
8.3.5學(xué)雷鋒手抄報