What are these elements and what do I use them for when making tables?

Please leave an example.

4 answers

0
points
This was chosen as the best answer

AFAIK these elements are to semantically mark the areas of a table.

<thead> marks out the header row, <tbody> marks out the main body of the table and <tfoot> marks out the footer row of the table. You would use them like this:

<table>
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
        </tr>
    </thead>
     <tfoot>
           <tr>
               <td>Footer column 1</td>
               <td>Footer column 2</td>
            </tr>
     </tfoot>
    <tbody>
          <tr>
              <td>Field 1</td>
              <td>Field 2</td>
           </tr>
           <tr>
              <td>Field 1</td>
              <td>Field 2</td>
           </tr>
     </tbody>
   </table>
Answered over 7 years ago by David Smalley
4
points

Rich is correct w/ his markup and these elements are used to group sections of a table. The TFOOT has to come before the TBODY and after the THEAD. This gives the TFOOT the ability to display on all pages when printing a long table and if scrolling is used on a table. If you were creating a shopping cart you could place the "price" and "quantity" totals inside of the TFOOT, so they would appear at the bottom of the table. The TBODY can be used to group a series of rows, and you can used more than one set of TBODY tags. So lets say you wanted alternating colors on every 3 rows, this is how you could do it.

Answered over 7 years ago by Efficient Pixel
1
point

If you don't specify tbody, browsers add it automatically.

A sample:

<table border="1">
  <thead>
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <td>Sum</td>
      <td>$180</td>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
    </tr>
  </tbody>
</table>
Answered over 7 years ago by Rich Bradshaw
  • So what are they for? Darryl Hein over 7 years ago
  • Well, the header, footer and body. How ever you feel that is useful. Rich Bradshaw over 7 years ago
0
points

They are part of the standard and should be used. Alltough browsers render tables correctly anyway (I think Firefox at least inserts tbody if it's missing). If your interested in actually reading about HTML, this book is good (I learned alot even though I've been coding for years):

Haine, Paul: HTML Mastery - Semantics, Standards, and Styling, Friends of ED

Answered over 7 years ago by Jens Hedqvist