Does a <tr> have to be inside a <tbody>

送分小仙女□ 提交于 2019-12-01 00:39:40

问题


Does a table row (<tr>) have to be in a table body (<tbody>), if the table has a table body, or can it exist outside of the table body?

<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>

回答1:


No, the <tr> can be in the <thead>, <tbody>, <tfoot> or it doesn't have to be in any of them.




回答2:


Contrary to what Terrill Thomson said, a table with <tr> tags outside of the <thead>, <tfoot> and <tbody> tags but inside the <table> tags will validated against the W3C Markup Validation Service.

This document was successfully checked as HTML 4.01 Transitional:

<!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>



回答3:


<tbody> is used to mark body of your <table>, if your table contains <thead> (table header) or <tfoot> (table footer) elements. If your table doesn't contain those elements, you're free to not use <tbody>.

Correct usage would be:

<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 specification to tables




回答4:


If you have a <tr> outside of a <tbody>, the page will not validate: http://validator.w3.org

As others have noted, <tbody> is optional unless you're using <thead> or <tfoot>. The main reason to use the latter two elements is so the header and footer are repeated on each page if a long table is printed.

It sounds like you might be creating something like a calendar, where you're wanting to have alternating rows of <th> (e.g., for dates) and <td> (e.g., for events on that date). If that's the case, you shouldn't wrap the alternating rows in <thead> and <tbody> - doing so would confuse the heck out of browsers when it came to printing the page. If you just leave the grouping elements out, your table will validate. However, some screen readers might be confused by that markup and apply the top-most row of headers to all cells beneath them. For a complex table such as this, you'll need to add additional markup to assure that screen readers understand how the table is organized. Here's your table with accessible markup:

<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> 

Alternatively, you might want to consider whether the data can be organized in multiple tables, or if an alternative version can be provided that would be easier to use for screen reader users. For example, an events calendar could additionally be presented as a list of events.




回答5:


<tbody> is optional, so the answer is 'yes <tr> can be outside " - see http://www.w3.org/TR/html4/struct/tables.html#h-11.2.3 .



来源:https://stackoverflow.com/questions/5872924/does-a-tr-have-to-be-inside-a-tbody

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!