任何表中是否都必须有<th>？

StackOverflow https://stackoverflow.com/questions/2278018

题

是否有必要有 <th> 在任何表中？即使表格没有标题？

表还有 3 个其他标签 <thead> <tbody> <tfoot> 即使我没有表页脚，是否有必要全部使用？Firefox 默认情况下将所有这些添加到代码中。

以及是否有必要， <th> 总是应该在 <thead>

如果我在从客户收到的内容中有一个标题，并且标题来自表格外部但与表格相关，那么我应该如何将该标题放置在表格中

如上表

<h3>Heading of table<h3>
<table>......</table>

作为表格标题

<table>
<thead><tr rowspan=3><th>Heading of table</th></tr></thead>

或作为表格的标题

<table>
<caption> Heading of table</caption>

哪个对屏幕阅读器有好处并且语义正确？

有帮助吗？

解决方案

根据 HTML DTD 这是 HTML 表格的内容模型：

<!ELEMENT TABLE - -
     (CAPTION?, (COL*|COLGROUP*), THEAD?, TFOOT?, TBODY+)>
<!ELEMENT CAPTION  - - (%inline;)*     -- table caption -->
<!ELEMENT THEAD    - O (TR)+           -- table header -->
<!ELEMENT TFOOT    - O (TR)+           -- table footer -->
<!ELEMENT TBODY    O O (TR)+           -- table body -->
<!ELEMENT COLGROUP - O (COL)*          -- table column group -->
<!ELEMENT COL      - O EMPTY           -- table column -->
<!ELEMENT TR       - O (TH|TD)+        -- table row -->
<!ELEMENT (TH|TD)  - O (%flow;)*       -- table header cell, table data cell-->

所以这是非法语法：

<thead><th>Heading of table</th></thead>

它应该是：

<thead><tr><th>Heading of table</th></tr></thead>

<th> 任何地方都不需要元素。它们只是两种细胞类型之一（另一种是 <td>）您可以在表行中使用。A <thead> 是一个可选的表部分，可以包含一行或多行。

编辑： 至于 为什么 使用 <thead> 有几个原因：

  1. 语义： 您正在区分表的内容和“元数据”。这最常用于划分列标题和数据行；
  2. 辅助功能： 它可以帮助使用屏幕阅读器的人理解表格的内容；
  3. 非屏幕媒体： 打印多页表格可以让您将 <thead> 每页顶部的内容，这样人们无需向后翻几页就可以理解各栏的含义；
  4. 造型： CSS可应用于 <tbody> 元素， <thead> 元素，两者或某种其他组合。它为您提供了其他东西来编写选择器；
  5. JavaScript： 使用 jQuery 和类似库时经常会出现这种情况。额外的信息对编写代码很有帮助。

作为 (5) 的示例，您可以这样做：

$("table > tbody > tr:nth-child(odd)").addClass("odd");

这 <thead> 元素意味着这些行不会以这种方式设置样式。或者你可能会这样做：

$("table > tbody > tr").hover(function() {
  $(this).addClass("hover");
}, function() {
  $(this).removeClass("hover");
});

和：

tr.hover { background: yellow; }

这再次排除了 <thead> 行。

最后，许多相同的论点也适用于使用 <th> 元素超过 <td> 要素：您表示该单元格不是数据，而是某种标题。通常，这些单元格会被分组为一行或多行 <thead> 部分或成为每行的第一个单元格，具体取决于表格的结构和性质。

其他提示

使用<th>s如果正在显示表格数据 - 使用每列一个。这是你的普通用户不错，屏幕阅读器是必不可少的。不要使用，如果你使用的是表格布局的目的<th>s（或其他邪恶计划......）

没有，这是没有必要有个。但它并不像你用个右。一般情况下，你必须每列。正确地使用的第一个简单的例子是：

<table>
<tr><th>Breed</th><th>Name</th></tr>
<tr><td>Pekingese</td><td>Pluto</td></tr>
<tr><td>Lab</td><td>Buddy</td></tr>
</table>

你也可以这样做：

<table>
<thead><tr><th>Breed</th><th>Name</th></tr></thead>
<tr><td>Pekingese</td><td>Pluto</td></tr>
<tr><td>Lab</td><td>Buddy</td></tr>
</table>

答案是

是的！

如果您使用表格来显示表格数据.

表格数据被组织成行和列是有原因的。 表格单元格中数据的含义由该数据所在的列和行的含义定义。

重要的是要识别那些赋予行和列含义的单元格，而不是与仅包含数据的单元格分开。

例如，下表绝对没有传达任何有意义的信息：

34 56 90 15
45 65 85 30
50 55 70 35

仅当行和列被指定名称时，数字才有意义。这些名称是使用标记的 <th>:

    二月 可能 八月 十一月
信息技术研究所
肯尼迪机场
IST

当然，我们仍然不知道这些数字意味着什么，这就是为什么 <caption> 需要：

选定机场的每月平均气温
    二月 可能 八月 十一月
信息技术研究所
肯尼迪机场
IST

最后，重要的是要注意测量单位、数据来源等细节。此类信息通常位于表格的页脚中：

选定机场的每月平均气温
    二月 可能 八月 十一月
信息技术研究所
肯尼迪机场
IST
Temperatures in °F. Source: Publication #456 MNMO

表的标题进入 <caption>. 。这 <thead> 和 <tfoot> 当表变大时，节特别有用。看 打印大型 HTML 表格时如何处理分页符 举个例子。

您可以使用 <colgroups> 将逻辑相关的数据分组在一起。

您想用什么最能描述你的数据。

<caption>将描述整个表。 th将创建其通常用来描述一列（但也可以用于行标题）的单个小区。

thead，tfoot，和tbody。都可以使用，并且所有可选只要它们的顺序，如果使用的话，你只有一个thead和一个tfoot（但你可以有多个tbody。许多浏览器（所有？）会增加他们含蓄，如果你不”吨，但该规范说他们是可选的。

th可以任何tr内部出现无论在哪里tr是

<table>
     <tr>
        <td>text</td>
     </tr>      
</table>

这是我能想到的最小表。

的好处是语义。所述<th>用于Ť能的ħ EADER。用它来标记你的列标题。通常内的<thead>。

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top