问题描述
是否有必要在任何表中包含< th> ？即使表没有标题？
is it necessary to have <th> in any table? even if table has no heading?
表还有3个其他标签< thead> < tbody> < tfoot> 是否需要全部使用，即使我没有表脚。 Firefox默认将所有这些代码添加到代码中。
table has 3 other tag <thead> <tbody> <tfoot> is it necessary to use all even if i have nothing for table footer. Firefox by default add all these in code.
，并且有必要在< th> 中始终添加< thead>
and is it necessary , <th> always should be in a <thead>
并且如果我从客户收到的内容中包含标题，并且标题来自外部表格，但与表格相关，那么我应该如何将该表格的标题放置
and if I have a heading in content received from client , and heading is from outside the table but related to table then how should i place that heading for table
作为上方表格
<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>
哪个对屏幕阅读器有益并且在语义上正确？
Which is good for screen reader and semantically correct?
推荐答案
根据这是HTML表的内容模型：
According to the HTML DTD this is the content model for HTML tables:
<!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> ）。 < thead> 是一个可选的表节，可以包含一个或多个行。
<th> elements aren't required anywhere. They're simply one of the two cell types (the other being <td>) that you can use in a table row. A <thead> is an optional table section that can contain one or more rows.
编辑：关于为什么使用< thead> 的原因有很多：
As to why to use <thead> there are several reasons:
- 语义：您要区分表的内容和元数据。这是最常用的方法，用于在列标题和数据行之间划定界限；
- 可访问性：它可以帮助使用屏幕阅读器的人理解表的内容；
- 非屏幕媒体：打印多页表格可能会允许您放置
< thead>每页顶部的内容，这样人们就可以在不翻动几页的情况下了解列的含义； - 样式： CSS可以应用于
< tbody>元素，< thead>元素，两者或其他组合。 - JavaScript ：使用jQuery和类似库时，通常会出现这种情况。额外的信息有助于编写代码。
- Semantic: You're differentiating between the content of your table and "metadata". This is most often used to delineate between column headers and data rows;
- Accessibility: it helps people who use screen readers to understand the contents of the table;
- Non-Screen Media: Printing a multi-page table may allow you to put the
<thead>contents at the top of each page so people can understand what the columns meaning without flicking back several pages; - Styling: CSS can be applied to
<tbody>elements,<thead>elements, both or some other combination. It gives you something else to write a selector against; - Javascript: this often comes up when using jQuery and similar libraries. The extra information is helpful in writing code.
作为（5）的示例，您可以这样做：
As an example of (5) you might do this:
$("table > tbody > tr:nth-child(odd)").addClass("odd");
< thead> 元素是指行不会以这种方式设置样式。或者，您可以这样做：
The <thead> element means those rows won't be styled that way. Or you might do:
$("table > tbody > tr").hover(function() {
$(this).addClass("hover");
}, function() {
$(this).removeClass("hover");
});
具有：
tr.hover { background: yellow; }
再次将< thead>
which again excludes the <thead> rows.
最后，许多相同的参数适用于在<$ c上使用< th> 元素$ c>< td> 元素：您要表示此单元格不是数据，而是某种报头。通常，这些单元格会在 部分的一个或多个行中分组在一起，或者取决于表的结构和性质，成为每行的第一个单元格。
Lastly, many of these same arguments apply to using <th> elements over <td> elements: you're indicating that this cell isn't data but a header of some kind. Often such cells will be grouped together in one or more rows in the <thead> section or be the first cell in each row depending on the structure and nature of your table.
这篇关于是否有必要具有在任何桌子上？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！