在上一章節(jié)中,我們已經(jīng)學習了用<table>標簽家族來定義一個表格,我們使用到了<tr>標簽來定義表格的行,<th>和<td>來定義表格的列,那么這一章,我們來學習<thead>標簽定義表格頭部,<tbody>標簽來定義表格的內(nèi)容,<tfoot>來定義表格的底部,來將我們的表格繼續(xù)完善吧！

創(chuàng)建表格的三個區(qū)域：

thead、tbody、tfoot

我們想實現(xiàn)一個成績表,各科成績和總分,效果如下圖：

我們表格第一行為表頭數(shù)據(jù),我們用<thead>標簽包裹,中間的科目和分數(shù)為表格的主體內(nèi)容,我們用<tbody>標簽包裹,最后的總分我們用<tfoot>標簽包裹。

1、<thead> 標簽定義表格的表頭。該標簽用于組合 HTML 表格的表頭內(nèi)容。

2、<tbody>…</tbody>：如果不加<thead><tbody><tfooter> , table表格加載完后才顯示。加上這些表格結(jié)構(gòu)， tbody包含行的內(nèi)容下載完優(yōu)先顯示，不必等待表格結(jié)束后在顯示，同時如果表格很長，用tbody分段，可以一部分一部分地顯示。（通俗理解table 可以按結(jié)構(gòu)一塊塊的顯示，不在等整個表格加載完后顯示。）

3、<tfoot> 元素用于對 HTML 表格中的表注（頁腳）內(nèi)容進行分組。

4、thead、tfoot 以及 tbody 元素使您有能力對表格中的行進行分組。當您創(chuàng)建某個表格時，您也許希望擁有一個標題行，一些帶有數(shù)據(jù)的行，以及位于底部的一個總計行。這種劃分使瀏覽器有能力支持獨立于表格標題和頁腳的表格正文滾動。當長的表格被打印時，表格的表頭和頁腳可被打印在包含表格數(shù)據(jù)的每張頁面上。