Sie sind hier: Startseite -> HTML-Grundlagen -> rowspan-Tag (Zeilen verbinden)

Tabellenzeilen in HTMl mit dem rowspan-Tag verbinden

Zeilen in einer Tabelle zusammenführen

Der colspan-Tag hilft, um Zellen in einer Tabelle zu verbinden. Diese Möglichkeit besteht aber auch vertikal, nur heißt der Parameter dann rowspan-Tag. Auch in diesem Fall werden Zellen zusammengeführt und eine andere Struktur in der Datentabelle hergestellt.

Es ist immer wieder der Fall, dass man nicht in jeder Zeile die gleichen Informationen bereitstellen kann und dann macht es Sinn, wenn man Zeilen verbinden kann, um den Raum sinnvoller zu nutzen.

Zeilen in der Tabelle vereinen - durch den rowspan-Tag

Ergibt:

Das ist eine Zelle mit der Höhe von zwei Die erste Zeile
Die zweite Zeile

Das Beispiel zeigt die schon öfter verwendete zweizeilige und zweispaltige Tabelle, wobei gleich die erste Zelle der ersten Zeile mit dem Parameter rowspan=2 ausgestattet wurde. Damit wurde festgelegt, dass die Zelle sich über zwei Zeilen erstreckt und das macht sie auch, denn rechts davon befinden sich die beiden normalen Zellen, die halbhoch dargestellt werden, so wie in vielen Beispielen der letzten Artikel auch.

Man kann statt td den th-Tag verwenden, wenn man automatisch die Schrift wie eine Überschrift fett schreiben möchte, ohne eine Formatierung zu wählen, sodass die alleine stehende Zeile hervorgehoben wird. Es gibt viele Einsatzmöglichkeiten für rowspan, wobei auch hier zu achten ist, dass man die Tabelle nicht unnötig kompliziert gestaltet, denn auskennen sollten sich die Leserinnen und Leser schon noch können.

Lesen Sie auch

So wie in normalen Texten kommt die Tabelle auch auf Internetseiten sehr oft vor und ist daher ein wichtiges Thema im Webdesign. Zum einen soll sie übersichtlich sein, zum anderen soll sie auch gefällig sein, wofür vor allem moderne CSS-Möglichkeiten Pate stehen. Die Grundstruktur sieht den table-Tag als Platzhalter vor und mit dem tr-Tag gibt es die Zeilen und mit dem td-Tag die Zellen.

Außerdem besteht die Möglichkeit, mit dem thead und tfoot Kopfzeile als Überschrift und Fußzeile als Abschluss einzubauen. Man kann die Spalten auch mit dem colgroup-Tag vorweg definiert, speziell in Sachen Breite.

Wichtige Funktionen können gefragt sein, wenn man nicht die übliche Tabelle braucht, sondern bestimmte Zeilen zusammenführen muss oder auch Spalten zusammengehören.

Themenseiten

Diesen Artikel teilen

Infos zum Artikel

Tabellenzeilen in HTML verbindenArtikel-Thema: Tabellenzeilen in HTMl mit dem rowspan-Tag verbinden
Beschreibung: Mit Hilfe des 🌍 rowspan-Tag kann man in einer HTML-Tabelle verschiedene ✅ Zeilen zusammenführen und eine andere Struktur schaffen.

Kategorien

Grundlagen
HTML-Grundlagen
CSS-Grundlagen
Javascript-Grundlagen
PHP-Grundlagen
MySQL-Grundlagen
SEO-Grundlagen

Infos, Tipps, Vermarktung
Webdesign-Lexikon
Online-Werbung
PHP-Codeschnipsel
Praxisartikel