HTML <thead> Tag

A styled <thead> tag.

<style>
  table.tb { width: 300px; border-collapse: collapse; }
  .tb th, .tb td { border: solid 1px #777; padding: 5px; }
  .tb thead { background-color:lightblue; }
</style>

<table class="tb">
  <thead>
    <tr>
      <th>First Name</th>
      <th>Last Name</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Denice</td>
      <td>Hobermann</td>
    </tr>
    <tr>
      <td>Paulo</td>
      <td>Cornell</td>
    </tr>
    <tr>
      <td>Jane</td>
      <td>Hollander</td>
    </tr>
  </tbody>
</table>

A <thead> element that styles the header row.

<style>
 table.tbl { width:100%; border-collapse: collapse; }
 .tbl th, .tbl td { padding:3px; border: 1px solid #999; }
  .tbl thead { background-color: #3630a3; color: white; }
</style>

<table class="tbl">

 <thead>
  <tr>
    <th>First name</th>
    <th>Last name</th>
    <th>Email</th>
    <th>City</th>
    <th>Country</th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>Tim</td>
    <td>Hallman</td>
    <td>thall@aa.com</td>
    <td>Dallas</td>
    <td>USA</td>
  </tr>
  <tr>
    <td>Jelle</td>
    <td>van Loenen</td>
    <td>jelle@loenen.org</td>
    <td>Arnhem</td>
    <td>Netherlands</td>
  </tr> <tr>
    <td>Jose</td>
    <td>Lopez</td>
    <td>lopez@argtech.ph</td>
    <td>Manila</td>
    <td>Philippines</td>
  </tr>
  <tr>
    <td>Jeroen</td>
    <td>Harmsma</td>
    <td>jharm@gmail.com</td>
    <td>The Hague</td>
    <td>Netherlands</td>
  </tr>
  <tr>
    <td>Sunil</td>
    <td>Gupta</td>
    <td>sunil@traf.in</td>
    <td>Mumbai</td>
    <td>India</td>
  </tr>
  <tr>
    <td>Henry</td>
    <td>Wong</td>
    <td>henry@google.com</td>
    <td>San Francisco</td>
    <td>USA</td>
  </tr>
  <tr>
    <td>Cindy</td>
    <td>Velasquez</td>
    <td>cindy@alicante.mx</td>
    <td>Mexico City</td>
    <td>Mexico</td>
  </tr>
 </tbody>

 <tfoot>
  <tr>
   <td colspan="5">This table has 7 data rows</td>
  </tr>
 </tfoot>

</table>

The <thead> element has no attributes, but it does accept global attributes. The following are commonly used.

For additional global attributes see our global attributes list.

Obsolete Attributes

Do not use the attributes listed below.  They are no longer valid on thead in HTML5.

The <thead> tag is part of a group of tags that are used to create HTML tables. This group is referred to as the Table tag group. Together, they allow you to create comprehensive HTML tables.

Here is a list of table tags

Here is when <thead> support started for each browser:

Chrome	1.0	Sep 2008
Firefox	1.0	Sep 2002
IE/Edge	1.0	Aug 1995
Opera	1.0	Jan 2006
Safari	1.0	Jan 2003

• Our HTML table Tag Reference
• Our HTML tbody Tag Reference
• Our HTML tfoot Tag Reference
• Our CSS Tables Tutorial