振宇網頁設計公司
關於振宇 網站設計作品 網站排名 線上洽詢
網頁設計:深入Table(表格)世界
2010/11/15
網頁設計:深入Table(表格)世界

  表格(table)是一直以來長期被大家使用的標籤,直到現在還是在用,不過呢因為現在的網站重構,建議大家不要表格(table)來佈局而很多朋友誤以為用表格(table)就是所謂的不標準了,其實不然,表格(table)是一個重要元素。

  表格標籤主要包含的標籤有table、caption、th、tr、td、thead、tfoot、tbody、col、colgroup,針對每個的介紹如下:

  <table>
table標籤可定義表格。在 <table> 標籤內部,你可以放置表格的標題、表格行、表格列、表格單元以及其他的表格。

  <caption>
caption 元素可定義一個表格標題。caption 標籤必須緊隨 table 標籤之後。您只能對每個表格定義一個標題。通常這個標題會被居中於表格之上。

  <th>
定義表格內的表頭儲存格。此 th 元素內部的文本通常會呈現為粗體。

  <tr>
在表格中定義一行。

  <td>
定義表格中的一個儲存格。

  <thead>
定義表格的表頭。
thead、tfoot 以及 tbody 元素使您有能力對表格中的行進行分組。當您創建某個表格時,您也許希望擁有一個標題行,一些帶有資料的行,以及位於底部的一個總計行。這種劃分使流覽器有能力支援獨立於表格標題和頁腳的表格正文滾動。當長的表格被列印時,表格的表頭和頁腳可被列印在包含表格資料的每張頁面上。

  <tbody>
定義一段表格主體(正文)。
使用 <tbody> 標籤,可以將表格分為一個單獨的部分。<tbody> 標籤可將表格中的一行或幾行合成一組。
雖然您可能想包括一個,甚至會在表格中包括兩個或更多個 <tbody> 標籤,但是我們建議最好在表格中沒有 <tbody> 標籤。
在 <tbody> 標籤中,只有 <tr> 標籤可以定義表格行。並且一旦定義,一個 <tbody> 標籤就是表格中的一個獨立的部分。例如不能從一個 <tbody> 跨越到另一個 <tbody> 中。
thead、tfoot 以及 tbody 元素使您有能力對表格中的行進行分組。當您創建某個表格時,您也許希望擁有一個標題行,一些帶有資料的行,以及位於底部的一個總計行。這種劃分使流覽器有能力支援獨立於表格標題和頁腳的表格正文滾動。當長的表格被列印時,表格的表頭和頁腳可被列印在包含表格資料的每張頁面上。

  <tfoot>
定義表格的頁腳(註腳)。

  thead、tfoot 以及 tbody 元素使您有能力對表格中的行進行分組。當您創建某個表格時,您也許希望擁有一個標題行,一些帶有資料的行,以及位於底部的一個總計行。這種劃分使流覽器有能力支援獨立於表格標題和頁腳的表格正文滾動。當長的表格被列印時,表格的表頭和頁腳可被列印在包含表格資料的每張頁面上。

  <col>
定義某個表格中針對一個或多個列的屬性值。您只能在表格或 colgroup 中使用此屬性。

  <colgroup>
定義表格列的分組。通過此元素,您可以對列進行組合以便進行格式化。此元素只有在 <table> 標籤內部才是合法的。
有兩種方式來使用 <colgroup> 標籤:一種是對幾個同樣的列進行簡單的定義,另一種是將幾個不同的列組合起來。

最後更新 ( 2010/11/15 )
相關文章
更多網頁設計教學

網站設計 FAQ

網站架構圖及設計流程

More...

網頁設計包括哪些費用?

More...

網站建置需要多少時間?

More...
預算有限,想先體驗網路行銷的效果嗎?
More...
如何讓商機源源不絕而來?
More...
我需不需要自行架設主機呢?
More...
什麼是網域名稱(網址)?什麼是虛擬主機(網站空間)?
More...

RUS Website Design 瑞宇.台中網頁設計公司  Copyright © 2004 振宇網頁設計 All rights Reserved.  線上詢價
振宇首頁關於振宇設計作品線上洽詢常見問題新聞時事網頁設計教學友站連結網站地圖  免費交換連結
回到首頁 聯絡振宇