亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

章節
問答
課簽
筆記
評論
占位
占位

使用thead、tbody、tfoot定義表格

在上一章節中,我們已經學習了用<table>標簽家族來定義一個表格,我們使用到了<tr>標簽來定義表格的行,<th>和<td>來定義表格的列,那么這一章,我們來學習<thead>標簽定義表格頭部,<tbody>標簽來定義表格的內容,<tfoot>來定義表格的底部,來將我們的表格繼續完善吧!

創建表格的三個區域:

thead、tbody、tfoot

我們想實現一個成績表,各科成績和總分,效果如下圖:

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

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

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

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

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

任務

根據上面所學的知識,請從右邊編輯器的第10行開始輸入代碼,實現上圖效果

?不會了怎么辦

1、<thead>標簽表示表格頭部,一般放<tr>和<th>標簽。

2、<tbody>標簽表示表格內容,一般放<tr>和<td>標簽。

3、<tfoot>標簽標簽表格腳部標注,一般放<tr>和<td>標簽。

||

提問題

寫筆記

公開筆記
提交
||

請驗證,完成請求

由于請求次數過多,請先驗證,完成再次請求

加群二維碼

打開微信掃碼自動綁定

您還未綁定服務號

綁定后可得到

  • · 粉絲專屬優惠福利
  • · 大咖直播交流干貨
  • · 課程更新,問題答復提醒
  • · 賬號支付安全提醒

收藏課程后,能更快找到我哦~

使用 Ctrl+D 可將課程添加到書簽

邀請您關注公眾號
關注后,及時獲悉本課程動態

舉報

0/150
提交
取消
全部 精華 我要發布
全部 我要發布
最熱 最新
只看我的

手記推薦

更多

本次提問將花費2個積分

你的積分不足,無法發表

為什么扣積分?

本次提問將花費2個積分

繼續發表請點擊 "確定"

為什么扣積分?