HTML lernen (2): Tabellen erstellen
Aufbau einer Tabelle
Aufbau einer Tabelle
Auf dieser Seite
Mit Bild
Sehr häufig werden in HTML-Dokumenten Tabellen eingesetzt. Diese dienen dazu, Daten in tabellarischer Form darzustellen oder mit sogenannten blinden Tabellen (ohne sichtbaren Rahmen) einzelne Gestaltungselemente auf der WWW-Seite zu positionieren. Zwar lässt sich das Layout einer Web-Seite mittlerweile auch durch den Einsatz von Stylesheets bestimmen (dazu kommen wir später), aber das Wissen wie man Tabellen gestaltet und benutzt, ist immer noch unverzichtbar im HTML Bereich. Ein positiver Aspekt beim Einsatz von Tabellen ist, dass die Darstellung in sehr vielen Browsern einheitlich ist, selbst in älteren Browsern wie dem Internet Explorer 5.0.
Mit Bild
Tabellenelemente
<table> |
Gesamte Tabelle (engl.: table) |
Das End-Tag </table> ist unbedingt erforderlich. Fehlt es, wird im Browser eine leere Seite dargestellt. |
<tr> |
Tabellenzeile (engl.: table row) |
Es führt zwar zu keiner fehlerhaften Darstellung wenn das End-Tag </tr> fehlt, es sollte aber korrekterweise eingesetzt werden. |
<td> |
Tabellenzelle (engl.: table data) |
Es führt zwar zu keiner fehlerhaften Darstellung wenn das End-Tag </td> fehlt, es sollte aber korrekterweise eingesetzt werden. |
<th> |
Überschrift (engl.: table header) |
Der Text in der Überschrift wird in der Zelle zentriert und automatisch vom Browser hervorgehoben (meist fett dargestellt). |
Mit Bild
Übung
In dieser Übung sollen Sie eine einfache Tabelle erstellen. Die Tabelle soll aus 3 Zeilen und 3 Spalten bestehen, wobei in der ersten Zeile die Überschrift eingesetzt wird.
Mit Bild
Aufgabe:
Öffnen Sie einen beliebigen Texteditor oder Ihren HTML-Editor und tragen Sie die Tags für das Grundgerüst der HTML-Datei ein.
Geben Sie bitte die entsprechenden Tags für die Tabelle ein.
Speichern Sie die Datei unter dem Namen "fluege.htm".
Mit Bild
Mit Bild