HTML lernen (2): Tabellen erstellen

Zeilen & Spalten

∅ 2.3 / 4 Bewertungen

Zeilen & Spalten

Auf dieser Seite

Oftmals ist es notwendig, neben- oder untereinanderliegende Tabellenzellen zu verbinden. So lässt sich beispielsweise erreichen, dass Text über mehrere Spalten geschrieben werden kann. Wenn Sie z.B. die drei nebeneinander liegende Zellen der ersten Zeile verbinden, müssen Sie darauf achten, dass in den weiteren Spalten der Tabelle jeweils drei Zellen vorhanden sind, das heißt die Summe der Zellen in einer Spalte sollte immer gleich ist. Verbinden Sie untereinander liegende Zellen, müssen Sie ebenfalls darauf achten, dass jede Zeile die gleiche Anzahl von Zellen enthält.

Attribute

colspan="X"

Nebeneinander liegende Zellen werden verbunden. Der angegebene Wert bezieht sich auf die Zellen, die verbunden werden sollen. Das Attribut muss in der ersten Zelle eingesetzt werden, die verbunden werden soll.

rowspan="X"

Untereinander liegende Zellen werden verbunden. Der angegebene Wert bezieht sich auf die Zellen, die verbunden werden sollen. Das Attribut muss in der ersten Zelle eingesetzt werden, die verbunden werden soll.

Übung

Aufgabe:

Diese Übung zeigt eine Tabelle, in der einige Zellen sowohl zeilen- als auch spaltenweise miteinander verbunden sind. Zusätzlich wurde einigen Tabellenzellen eine andere Hintergrundfarbe zugewiesen. Legen Sie als erstes eine neue HTML-Datei an. Setzen Sie in der Tabelle anschließend die folgenden HTML-Anweisungen ein:

  • Rahmenstärke der Tabelle ein Pixel

  • Drei Spalten

  • Fünf Zeilen

  • Die Zellen der ersten Zeile werden verbunden.

  • Hintergrundfarbe = "#99CCCC"

  • Die Zellen der ersten Spalte werden ab der zweiten Zeile verbunden,

  • Hintergrundfarbe = "#99CCCC" (siehe Vorschau)

  • Hintergrundfarbe für die zweite und dritte Zelle der zweiten Zeile ="#0099CC"

Hier finden Sie die Lösung .