Einfache Tabellen beginnen mit dem Tag <table>. Danach wird jede Zeile mit <tr> (table row) eingeleitet, jede Zelle mit <td> (table data). Zellen, Zeilen und Tabelle werden dann in umgekehrter Reihenfolge wieder beendet: zuerst Ende der Zelle </td>, anschließend Ende der Reihe </tr> und zum Schluss Ende der Tabelle </table>
Es ist auch möglich, Tabellen zu schachteln, das heißt, in einer Zelle kann eine weitere Tabelle stehen.
Ein Trick, um Bilder und Text nebeneinander anzuordnen: Man setzt sie in Tabellenzellen mit unsichtbarem Rand.
| <table> <tr> <td>Wir befinden uns in der Zelle links oben. Rechts neben dieser Zelle kann man einen müden Hund erkennen.</td> <td><img src="batschi1.jpg" alt="Bild eines Hundes" /></td> </tr> <tr> <td><img src="batschi2.jpg" alt="Bild eines sehr müden Hundes" /></td> <td>Das ist die Zelle rechts unten. In der Zelle links daneben seht ihr das Bild eines sehr müden Hundes.</td> </tr> </table> |
| Wir befinden uns in der Zelle links oben. Rechts neben dieser Zelle kann man einen müden Hund erkennen. |  |
 | Das ist die Zelle rechts unten. In der Zelle links daneben seht ihr das Bild eines sehr müden Hundes. |
Der Quelltext zum Beispiel (ohne Rahmen und Hintergrund):
<table style = "width: 50%;">
<tr>
<td style = "border: none ; background: transparent;">
Wir befinden uns in der Zelle links oben. Rechts neben dieser Zelle kann man einen müden Hund erkennen.</td>
<td style = "border: none; background: transparent;"><img src="batschi1.jpg" alt="Bild eines Hundes" /></td>
</tr>
<tr>
<td style = "border: none; background: transparent;"><img src="batschi2.jpg"
alt="Bild eines sehr müden Hundes" /></td>
<td style = "border: none; background: transparent;">Das ist die Zelle rechts unten. In der Zelle links daneben seht ihr das Bild eines sehr müden Hundes.</td>
</tr>
</table>