Tables in HTML5

The HTML elements that allow you to build tables

Share this page

New! My 44-page ebook "CSS in 44 minutes" is out! 😃

Get it now →

# caption

Defines the title of a <table>.

Example: Copy

The Beatles
John Lennon Rhythm Guitar
Paul McCartney Bass
George Harrison Lead Guitar
Ringo Starr Drums 
<table>
  <caption>The Beatles</caption>
  <tr>
    <td>John Lennon</td>
    <td>Rhythm Guitar</td>
  </tr>
  <tr>
    <td>Paul McCartney</td>
    <td>Bass</td>
  </tr>
  <tr>
    <td>George Harrison</td>
    <td>Lead Guitar</td>
  </tr>
  <tr>
    <td>Ringo Starr</td>
    <td>Drums</td>
  </tr>
</table>

# table

Defines a container for tabular data.

Example: Copy

Name Instrument
Name Instrument
John Lennon Rhythm Guitar
Paul McCartney Bass
George Harrison Lead Guitar
Ringo Starr Drums 
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Instrument</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th>Name</th>
      <th>Instrument</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>John Lennon</td>
      <td>Rhythm Guitar</td>
    </tr>
    <tr>
      <td>Paul McCartney</td>
      <td>Bass</td>
    </tr>
    <tr>
      <td>George Harrison</td>
      <td>Lead Guitar</td>
    </tr>
    <tr>
      <td>Ringo Starr</td>
      <td>Drums</td>
    </tr>
  </tbody>
</table>

# tbody

Defines a group of table rows <tr>.

Example: Copy

Name Instrument
Name Instrument
John Lennon Rhythm Guitar
Paul McCartney Bass
George Harrison Lead Guitar
Ringo Starr Drums 
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Instrument</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th>Name</th>
      <th>Instrument</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>John Lennon</td>
      <td>Rhythm Guitar</td>
    </tr>
    <tr>
      <td>Paul McCartney</td>
      <td>Bass</td>
    </tr>
    <tr>
      <td>George Harrison</td>
      <td>Lead Guitar</td>
    </tr>
    <tr>
      <td>Ringo Starr</td>
      <td>Drums</td>
    </tr>
  </tbody>
</table>

# td

Defines a table cell. Must be a direct child of a <tr>.

Example: Copy

colspan

Defines how many columns a cell should span across.

"3"

You can use any integer.

rowspan

Defines how many rows a cell should span across.

"2"

You can use any integer.

# tfoot

Defines a group of table rows <tr> at the end of a <table>.

Example: Copy

Name Instrument
Name Instrument
John Lennon Rhythm Guitar
Paul McCartney Bass
George Harrison Lead Guitar
Ringo Starr Drums 
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Instrument</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th>Name</th>
      <th>Instrument</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>John Lennon</td>
      <td>Rhythm Guitar</td>
    </tr>
    <tr>
      <td>Paul McCartney</td>
      <td>Bass</td>
    </tr>
    <tr>
      <td>George Harrison</td>
      <td>Lead Guitar</td>
    </tr>
    <tr>
      <td>Ringo Starr</td>
      <td>Drums</td>
    </tr>
  </tbody>
</table>

# th

Defines a table header. Must be a direct child of a <tr>.

Example: Copy

colspan

Defines how many columns a cell should span across.

"3"

You can use any integer.

rowspan

Defines how many rows a cell should span across.

"2"

You can use any integer.

# thead

Defines a group of table rows <tr> at the start of a <table>.

Example: Copy

Name Instrument
Name Instrument
John Lennon Rhythm Guitar
Paul McCartney Bass
George Harrison Lead Guitar
Ringo Starr Drums 
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Instrument</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th>Name</th>
      <th>Instrument</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>John Lennon</td>
      <td>Rhythm Guitar</td>
    </tr>
    <tr>
      <td>Paul McCartney</td>
      <td>Bass</td>
    </tr>
    <tr>
      <td>George Harrison</td>
      <td>Lead Guitar</td>
    </tr>
    <tr>
      <td>Ringo Starr</td>
      <td>Drums</td>
    </tr>
  </tbody>
</table>

# tr

Defines a table row.

Example: Copy