html 表：thead vs th

問題描述

它看起來像 (根據 this page 的例子，無論如何)，如果你使用 THEAD，你不需要使用 TH 。

真的嗎？如果是這樣，THEAD 對 TH 的優點/缺點是什麼？

最佳解決方案

<thead> 標籤用於對 HTML 表格中的標題內容進行分組。 thead 元素應與 tbody 和 tfoot 元素結合使用。

更多：thead

您可以使用<thead> 封裝整行 (或行) 來將其指定為表頭。根據規範，

“This division enables user agents to support scrolling of table bodies independently of the table head and foot. When long tables are printed, the table head and foot information may be repeated on each page that contains table data.”

另一方面，<th> 用於將特定單元作為標題單元而不是普通數據單元。

次佳解決方案

如果要使用<thead> 和<th>，請勿忘記將<th> 嵌套在<tr> 內。否則代碼可能無效。例：

<table>
  <thead>
    <tr>
      <th>Season</th>
      <th>Goals</th>
      <th>Assists</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>2009-2010</th>
      <td>25</td>
      <td>43</td>
    </tr>
    <tr>
      <th>2011-2012</th>
      <td>40</td>
      <td>20</td>
    </tr>
  </tbody>
</table>

第三種解決方案

th 比 thead 內部更具體。 th 單元是指定相應 td 單元格的標題。實際上，您可以將 headers 屬性添加到指向 th 單元格 (用於屏幕閲讀器) 的 td 單元格。所以 th 與該列的 td 是直接相關的。

但是，thead 可以包括任何信息… 通常是它包括 th 單元格，但它也可以包括任何您認為適合作為表頂部的信息 (除了標題，因為它有自己的標籤) 。

第四種方案

<thead> 是特殊的，它可以用於在打印版本的頁面頂部重複標題行。

參考文獻

• html tables: thead vs th

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。