von Thomas Salvador.
Grundlegende HTML-Tabelle:
<table> <tr> <th>Überschrift,Z1,S1</th> <th>Überschrift,Z1,S2</th> <td>Z1,S3</td> </tr> <tr> <th>Überschrift,Z2,S1</th> <td>Z2,S2</td> <td>Z2,S3</td> </tr> <tr> <td>Z3,S1</td> <td>Z3,S2</td> <td>Z3,S3</td> </tr> </table>
Mit dem HTML Tag <table> wird eine HTML-Tabelle gesetzt und beschrieben.
Diese Tabellen bestehen aus Zeilen (<tr>), die ihrerseits in normale Zellen (<td>) und Überschriftszellen (<th>) zerfallen.
Tabellen in HTML sind sehr flexibel. So können Bereiche von Zeilen explizit als Kopfbereich (<thead>), Hauptbereich (<tbody>) und Fußbereich (<tfoot>) der Tabelle bezeichnet werden. Diese Bereiche sind optional und geben den umschlossenen Zeilen und Zellen eine besondere Bedeutung, so dass zum Beispiel ein (<thead>)-Bereich auf jeder Seite wiederholt wird, wenn sich die Tabelle über mehrere Seiten erstreckt.
Darüberhinaus wird die Möglichkeit geboten, Tabellen logisch in Spalten (<col>) zu zerlegen, die auch gruppiert (<colgroup>) werden können.
Die Anweisung <table> hat die HTML Attribute:
| Attribut | Beschreibung |
|---|---|
| align | Horizontale Position einer Tabelle |
| background | Hintergrundbild der Tabelle |
| bgcolor | Hintergrundfarbe der Tabelle |
| border | Rahmendicke der Tabelle |
| cellpadding | Abstand innerhalb von Zellen |
| cellspacing | Abstand zwischen den Tabellenzellen |
| class | Space-separierte Liste von CSS-Klassen |
| dir | Ausrichtung von Text und Tabellen |
| frame | Spezifizierung des Außenrahmens |
| id | Universalattribut |
| lang | Sprache des Elementes |
| onclick | Auszuführender Javascript-Code bei Klick |
| ondblclick | Auszuführender Javascript-Code bei Doppelklick |
| onkeydown | Auszuführender Javascript-Code bei Drücken einer Taste |
| onkeypress | Auszuführender Javascript-Code bei gedrückt gehaltener Taste |
| onkeyup | Auszuführender Javascript-Code bei Loslassen einer Taste |
| onmousedown | Auszuführender Javascript-Code bei Drücken einer Maustaste |
| onmousemove | Auszuführender Javascript-Code, wenn die Maus bewegt wird |
| onmouseout | Auszuführender Javascript-Code, wenn die Maus das Element verlässt |
| onmouseover | Auszuführender Javascript-Code, wenn die Maus auf das Element bewegt wird |
| onmouseup | Auszuführender Javascript-Code bei Loslassen einer Maustaste |
| rules | Innenlinien bei table |
| style | Inline Style |
| summary | Zusammenfassung von Tabellen |
| title | Bezeichnender Titel |
| width | Breite der Tabelle |
<table> wird zumindest von den HTML Browsern Avant Palm OS, Avant Windows, Chrome, Firefox, Internet Explorer, Netscape, Opera, Safari und Web TV / MSN unterstützt.
<table> wird in den Standards HTML und XHTML definiert.
Der HTML Befehl <table> kann die HTML-Tags <caption>, <col>, <colgroup>, <tbody>, <tfoot> und <thead> enthalten.
<table> kann in den HTML Tags <blockquote>, <body>, <button>, <center>, <dd>, <div>, <fieldset>, <form>, <iframe>, <li>, <noframes>, <noscript>, <object>, <td> und <th> genutzt werden.
Die Formatierungsmöglichkeiten von Tabellen waren bereits in HTML so umfassend, dass Tabellen häufig genutzt wurden, um ein Layout zu erzeugen. Heutzutage sollte man Tabellen nur noch im geeigneten Kontext zur tabellarischen Darstellung von Informationen nutzen, da CSS überlegende Formatierungsmöglichkeiten bietet. Insbesondere sind einige Optionen offiziell verworfen – von Browsern natürlich weiterhin unterstützt. Sie können mit CSS ebenso gut oder besser beschrieben werden.
Trotz der Möglichkeiten von CSS soll nicht verschwiegen werden, dass einiges mit Tabellen oft leichter zu erzeugen ist. Ein Trade-Off zwischen Zugänglichkeit (Barrierearmut), Standardkonformität und Aufwand bei der Erstellung ist hier also zu finden.
Keine.