Einführung in HTML-Tabellen

Eine Tabelle in HTML wird mit dem <table>-Tag erstellt.

Sie besteht aus:

• Tabellenzeilen (<tr> - Table Row): Jede Zeile wird durch ein <tr>-Tag definiert.
• Tabellenzellen (<td>- Table Data): Die Inhalte der Zellen stehen zwischen den <td>-Tags.
• <td> repräsentiert eine Datenzelle (Table Data).
• <th> repräsentiert eine Kopfzelle (Table Header), die standardmäßig fett und zentriert dargestellt wird.

Grundstruktur einer Tabelle

Eine einfache Tabelle mit einer Zeile und zwei Spalten sieht so aus:

<table> = Tabelle Start <tr> = Tabellenzeile Start <td>Spalte 1</td> = Zelle 1 <td>Spalte 2</td> = Zelle 2 </tr> = Tabellenzeile Ende </table>= Tabelle Ende

Um umfangreiche Tabellen zu strukturieren, können folgende Tags verwendet werden:

• Tabellenkopf (<thead>): Enthält Kopfzellen.
• Tabellenkörper (<tbody>): Enthält Datenzellen.
• Tabellenfuß (<tfoot>): Enthält Zusammenfassungen oder erklärende Daten.

Beispiel: Tabelle mit thead, tbody und tfoot

<table> <thead> <tr> <th>Kopf</th> </tr> </thead> <tbody> <tr> <td>Inhalt</td> </tr> </tbody> <tfoot> <tr> <td>Fuß</td> </tr> </tfoot> </table>

Vorteile der Unterteilung

Strukturierte Daten:

• Der Tabellenkopf (<thead>) enthält Überschriften.
• Der Tabellenkörper (<tbody>) enthält Hauptdaten.
• Der Tabellenfuß (<tfoot>) enthält Zusammenfassungen oder zusätzliche Erklärungen.

Druckoptimierung:

• Wenn eine Tabelle länger als eine Seite ist, werden <thead> und <tfoot> auf jeder Seite wiederholt.