Table headers in HTML - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a table header cell.

HTML

<table>
  <tr>
    <[1]>Name</[1]>
  </tr>
</table>

Drag options to blanks, or click blank then click option'

Athead

Btd

Ctr

Dth

Attempts:

3 left

💡 Hint

Common Mistakes

Using instead of for header cells.

Using or tags incorrectly inside a row.

The <th> tag defines a header cell in a table row.

2fill in blank

medium

Complete the code to add a table header row inside the table head section.

HTML

<table>
  <[1]>
    <tr>
      <th>Age</th>
    </tr>
  </[1]>
</table>

Drag options to blanks, or click blank then click option'

Atr

Btfoot

Cthead

Dtbody

Attempts:

3 left

💡 Hint

Common Mistakes

Using or instead of for header rows.

Using as a container tag.

The <thead> tag groups the header content in a table.

3fill in blank

hard

Fix the error in the table header cell tag.

HTML

<table>
  <tr>
    <[1]>Email</[1]>
  </tr>
</table>

Drag options to blanks, or click blank then click option'

Ath

Btr

Cthead

Dtd

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing and tags in the same cell.

Using or tags incorrectly.

The opening tag must match the closing tag. Use <th> for header cells, not <td>.

4fill in blank

hard

Fill both blanks to create a table with a header and body.

HTML

<table>
  <[1]>
    <tr><th>City</th></tr>
  </[1]>
  <[2]>
    <tr><td>Paris</td></tr>
  </[2]>
</table>

Drag options to blanks, or click blank then click option'

Athead

Btbody

Ctfoot

Dtr

Attempts:

3 left

💡 Hint

Common Mistakes

Using instead of for body rows.

Using as a container for multiple rows.

<thead> wraps header rows, and <tbody> wraps body rows in a table.

5fill in blank

hard

Fill all three blanks to create a table with a header row and two body rows.

HTML

<table>
  <[1]>
    <tr><th>Name</th><th>Age</th></tr>
  </[1]>
  <[2]>
    <tr><td>Alice</td><td>30</td></tr>
    <tr><td>Bob</td><td>25</td></tr>
  </[2]>
  <[3]></[3]>
</table>

Drag options to blanks, or click blank then click option'

Athead

Btbody

Ctfoot

Dtr

Attempts:

3 left

💡 Hint

Common Mistakes

Omitting the footer section or using wrong tags.

Using as a container for multiple rows.

<thead> for header, <tbody> for body, and <tfoot> for footer sections of a table.