MaraHTML

Coding resources, tutorials and more.

HTML Tables

Share this page:

A table represents information in a grid format.

Note: The tables used in the example have some basic CSS formatting just to make them easier to follow.

Basic table structure

The <table> tag is used to create a table.
The <tr> tag indicates the start of a new table.
The <td> tag represents an individual cell of a table.
The <th> tag is used like the <td> tag but it represents the heading of either a row or column. Even if a cell has no content use the <td> or <th> elements to represent an empty cell.

Now to watch the code in action.

<table>

<tr>

<th></th>
<th>Addow</th>
<th>Arinya</th>
<th>Azul</th>

</tr>
<tr>

<th>Alien</th>
<td></td>
<td><img src="http://images.marapets.com/pets/Arinya_alien.gif"></td>
<td><img src="http://images.marapets.com/pets/Azul_alien.gif"></td>

</tr>
<tr>

<th>American</th>
<td><img src="http://images.marapets.com/pets/Addow_american.gif"></td>
<td><img src="http://images.marapets.com/pets/Arinya_american.gif"></td>
<td></td>

</tr>

</table>