html表格設定

標籤：gif   有用   文本   避免   class   技術   屬性   school   列表   

表格

表格由 <table> 標籤來定義。每個表格均有若干行（由 <tr> 標籤定義），每行被分割為若干儲存格（由 <td> 標籤定義）。字母 td 指表格式資料（table data），即資料儲存格的內容。資料儲存格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。

<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

表格和邊框屬性

如果不定義邊框屬性，表格將不顯示邊框。有時這很有用，但是大多數時候，我們希望顯示邊框。

使用邊框屬性來顯示一個帶有邊框的表格：

<table border="1"><tr><td>Row 1, cell 1</td><td>Row 1, cell 2</td></tr></table>

表格的表頭

表格的表頭使用 <th> 標籤進行定義。

大多數瀏覽器會把表頭顯示為粗體置中的文本：

<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

表格中的空儲存格

在一些瀏覽器中，沒有內容的表格單元顯示得不太好。如果某個儲存格是空的（沒有內容），瀏覽器可能無法顯示出這個儲存格的邊框。

<table border="1"><tr><td>row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td></td><td>row 2, cell 2</td></tr></table>

瀏覽器可能會這樣顯示：

注意：這個空的儲存格的邊框沒有被顯示出來。為了避免這種情況，在空儲存格中添加一個空格預留位置，就可以將邊框顯示出來。

<table border="1"><tr><td>row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td>&nbsp;</td><td>row 2, cell 2</td></tr></table>

在瀏覽器中顯示如下：

row 1, cell 1	row 1, cell 2
	row 2, cell 2

html表格設定