HTML: Spaltenformatierung mit Colgroup
Anzeige
von Christoph Hörl
Colgroup gehört zu den eher selten gesehenen HTML-Elementen. Damit lassen sich innerhalb einer Tabelle ganze Spalten auf einmal formatieren - ohne lästige Wiederholungen. Allerdings sind sich die Browser in der Interpretation nicht einig.
Mit Colgroup lassen sich mehrere Spalten, unabhängig ob TD oder TH, zu einer Gruppe zusammenfassen. Der Colgroup-Block muss zwischen Öffnungs-Tag der Tabelle und der ersten <tr>-Zeile platziert werden, es können aber auch mehrere Gruppen definiert werden.
Zwischen Anfangs- und End-Tag definiert man dann, ähnlich wie bei Frames, die einzelnen Spalten durch den Inline-Tag <col>. Diesem Tag wird mit dem Attribut "width" die Breite der Spalte zugewiesen.
<table style="border:1px solid black;">
<colgroup>
<col width="200" style="background-color:#AAAAAA; font-color:#800000;
font-weight:bold; font-family:Verdana" />
<col width="100" style="background-color:#FE8924;"
span="2"/>
</colgroup>
<tr>
<th>Überschrift 1</th>
<th>Überschrift 2-1</th>
<th>Überschrift 2-2</th>
</tr>
<tr>
<td>Spalte 1</td>
<td>Spalte 2-1</td>
<td>Spalte 2-2</td>
</tr>
<tr>
<td>Spalte 1</td>
<td>Spalte 2-1</td>
<td>Spalte 2-2</td>
</tr>
</table>
Ein weiteres Attribut ist "span", das es ermöglicht mehrere Col-Tags zu einer weiteren Gruppe zusammenzufassen. Beachtet werden muss dabei nur, dass die mit "width" angegebene Breite für alle Spalten der Gruppe gilt. "span" erwartet als Attribut einen numerischen Wert, der die Anzahl der zu gruppierenden Spalten wiedergibt.

Die Tabelle im Opera Browser

...in Mozilla
Bis hierhin gibt es in Sachen Browserkompatibilität noch keine Einschränkungen. Um die Tabelle zu verschönern, kann auch das Attribut "style" eingesetzt werden, das CSS-Code in die Tabellenspalten bringt. Hier werden nun erste Unterschiede zwischen den Browsern sichtbar. Mozilla Firefox 0.8 unterstützt keine CSS-Formatierung, wohingegen Opera 7 nur den Wert "background" kennt, der der Spalte die Hintergrundfarbe zuweist.

...und im Explorer
Der Microsoft Internet Explorer 6 erkennt jegliche Formatierung, ob Schrift, Farbe oder Abstand. Solange man jedoch keine Spalten formatieren, sondern nur Breiten festlegen will, ist es das Col-Element eine praktische Vereinfachung.
Verwandte Artikel
Meine Meinung
Bitte beachten Sie: Werbung und Spam sind unerwünscht und können eine Rechnung zur Folge haben. Woher kommen die Bilder neben den Kommentaren?








