Wenn ihr eure Website mit HTML programmiert, können Tabellen helfen, Inhalte übersichtlich darzustellen. Wie ihr eine HTML-Tabelle erstellt, zeigen wir euch hier auf GIGA.
Tabellen setzen Inhalte über Zeilen und Spalten in Verhältnis zueinander und zählen zu den komplexeren Darstellungsmöglichkeiten von HTML. Wie ihr eine solche Tabelle mit HTML programmiert und wie ihr diese gestalten könnt, erklären wir in diesem Artikel.
So bringt ihr auch ältere Programme unter Windows 10 zum Laufen:
HTML-Tabelle erstellen: Schritt für Schritt
Wenn ihr eine Tabelle erstellt, solltet ihr die folgenden Punkte beachten:
- Jeder Tag in HTML muss wieder geschlossen werden: Eine Tabelle öffnet ihr mit dem Tag table und schließt sie mit /table wieder.
- Eine Tabelle besteht aus Reihen und Spalten. In HTML muss nur die Reihe definiert werden. Auf Englisch heißt dies table row, daher leitet sich der Tag <tr> ab.
- Die Spalte wird nicht definiert. Sie kann für Layout-Zwecke angesprochen werden – hierfür gibt es Tags wie colgroup und colspace (von column = Spalte). Damit könnt ihr beispielsweise Spalten optisch verbinden. Eine Definition der Spalte ist aber nicht nötig, um eine Tabelle mit Daten zu füllen.
- Stattdessen definiert ihr innerhalb der Reihe (tr) jeden einzelnen Eintrag mit dem Tag <td> (table data).
- Die Einträge der Kopfzeile leitet ihr mit (table header) ein.
Eine fertige Tabelle sieht also folgendermaßen aus:
table
tr
td Linke Spalte, erster Eintrag /td
td Linke Spalte, zweiter Eintrag /td
/tr
tr
td Rechte Spalte, erster Eintrag /td
td Rechte Spalte, zweiter Eintrag /td
/tr
/table
Mit den oben genannten Tags könnt ihr eine einfache Tabelle erstellen. Anschließend legt ihr das Design mit CSS fest. Auf selfhtml.org findet ihr detaillierte Beschreibungen zu den einzelnen CSS-Funktionen einer Tabelle.
Kennt ihr euch mit den vergangenen Keynotes von Apple aus?
