9

如果表格有表格主体,表格行 ( <tr>) 是否必须在表格主体 ( <tbody>) 中,还是可以存在于表格主体之外?

<table>
    <tr>
      <td colspan='2'>...</td>
    </tr>

    <tbody>
      <tr>
        <td>...</td>
        <td>...</td>
      </tr>
    </tbody>

    <tr>
      <td colspan='2'>...</td>
    </tr>

    <tbody>
      <tr>
        <td>...</td>
        <td>...</td>
      </tr>
    </tbody>

</table>
4

5 回答 5

7

与 Terrill Thomson 所说的相反,带有 ,<tr>之外的标签<thead><tfoot>标签<tbody>但在<table>标签内的表将根据W3C 标记验证服务进行验证。

此文档已成功检查为 HTML 4.01 过渡:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
  <head>
  </head>
  <body>
    <table>
      <thead>
        <th colspan="2">head1</th>
        <th>head2</th>
      </thead>
      <tfoot>
        <th colspan="2">foot1</th>
        <th>foot2</th>
      </tfoot>

      <tr><td colspan="3">this row is outside of thead and tfoot</td></tr>

      <tbody>
        <tr>
          <td>1-1</td>
          <td>1-2</td>
          <td>1-3</td>
        </tr>
        <tr>
          <td>2-1</td>
          <td>2-2</td>
          <td>3-3</td>
        </tr>
        <tr>
          <td>3-1</td>
          <td>3-2</td>
          <td>3-3</td>
        </tr>
      </tbody>
  </body>
</html>
于 2012-08-01T20:14:40.073 回答
6

不,<tr>可以在<thead>, 中<tbody><tfoot>或者不必在其中任何一个中。

于 2011-05-03T16:56:26.173 回答
1

<tbody><table>如果您的表格包含<thead>(表格标题)或<tfoot>(表格页脚)元素,则用于标记您的正文。如果您的表格不包含这些元素,您可以不使用<tbody>.

正确的用法是:

<table>
<thead><tr><th>Item          </th><th>Cost </th></tr></thead>
<tbody><tr><td>Stack Overflow</td><td>Free </td></tr>
       <tr><td>Something cool</td><td>$1.00</td></tr></tbody>
</table>

表格的 HTML4 规范

于 2011-05-03T17:02:02.017 回答
1

如果您有 a 的<tr>外部<tbody>,则该页面将无法验证:http: //validator.w3.org

正如其他人所指出的,<tbody>除非您使用<thead>or ,否则它是可选的<tfoot>。使用后两个元素的主要原因是,如果打印长表,则在每页上重复页眉和页脚。

听起来您可能正在创建类似日历的东西,您希望在其中交替行<th>(例如,用于日期)和<td>(例如,用于该日期的事件)。如果是这种情况,您不应该将交替行包含在<thead>和中<tbody>- 这样做会在打印页面时混淆浏览器。如果您只是将分组元素排除在外,您的表格将验证。但是,某些屏幕阅读器可能会对该标记感到困惑,并将最上面的标题行应用于其下方的所有单元格。对于这样的复杂表格,您需要添加额外的标记以确保屏幕阅读器了解表格的组织方式。这是带有可访问标记的表格:

<table summary="A brief description of how the table is organized, for screen reader users">
  <tr>
    <th colspan='2' id="header1">...</th>
  </tr>
  <tr>
    <td headers="header1">...</td>
    <td headers="header1">...</td>
  </tr>
  <tr>
    <th colspan='2' id="header2">...</th>
  </tr>
  <tr>
    <td headers="header2">...</td>
    <td headers="header2">...</td>
  </tr>
</table> 

或者,您可能需要考虑是否可以在多个表中组织数据,或者是否可以提供更易于屏幕阅读器用户使用的替代版本。例如,事件日历可以另外呈现为事件列表。

于 2011-05-09T16:27:59.847 回答
0

<tbody> 是可选的,所以答案是“是的 <tr> 可以在外面” - 请参阅http://www.w3.org/TR/html4/struct/tables.html#h-11.2.3

于 2011-05-03T17:01:07.227 回答