by Flo

Sometimes we want to give our tables titles.
There are two tags that allow us to do this:

  1. Caption Tag - <caption> </caption>
  2. Header Tag - <th> </th>

This Is the Caption!
This Is the Head!
The caption tag is used to give a table a title or caption that appears to be ABOVE (default) the table itself The red text above is the table caption. This tag's characteristics:

  • appears to be ABOVE or BELOW the table itself, outside the table border.
  • automatically centers text
  • functions like a combined row and table data tag
    (eliminate the row tag before the caption tag)
  • font tags go inside it
  • use <caption align="bottom"> so the caption will appear BELOW the table instead of above it
  • can not have a caption above and below in the same table
  • needs to be closed, just like any other table tag </caption>.
The table header tag is also used for a table title, but it looks like part of the table and is the green text above. This is a special table data cell that automatically:

  • centers text and images
  • renders text boldface
  • font tags go inside it
  • valign is at the top
  • must be enclosed by a row tag:
    <tr> <th> Content </th> </tr>


Here you see an image in place of text in the caption tag. Altho the image is part of the table, it looks like it doesn't belong in the table.

Now the same image is in a header tag. So it looks like it is part of the table.

Now here's the same image at the bottom of the table in the caption tag. But the caption tag is placed first inside the table tag, with the added attribute:

<caption align="bottom">

Back to Table Dictionary

Tandem Tooters ~ ~ ~ Copyright © 2014 ~ ~ ~ Tone By Tone Dot Net