Lädt...

HTML-Tabellenüberschriften

Nach Tabellengrößen geht es um die Bedeutung der Labels: th, optional scope, und caption. Optik bleibt CSS; Bedeutung bleibt HTML.

Warum Überschriftenzellen nicht nur fettes `td` sind

Hilfstechnologien brauchen echtes th. Fettes td sieht ähnlich aus, trägt aber keine Header-Semantik.

Direkte Antwort

Beschriften Sie mit th. Nutzen Sie scope="col"/scope="row" bei Bedarf und <caption> für den Tabellentitel. Werte bleiben in td.

Spaltenüberschriften mit caption

Obere Header-Zeile mit th scope="col" plus caption.

Column headers and caption

html

HTML Code

<table>
<caption>Weekly inventory</caption>
<tr>
<th scope="col">Item</th>
<th scope="col">Qty</th>
<th scope="col">Aisle</th>
</tr>
<tr>
<td>Notebook</td>
<td>12</td>
<td>B2</td>
</tr>
<tr>
<td>USB cable</td>
<td>7</td>
<td>A1</td>
</tr>
</table>

Beispiel Spalten lesen

caption in table
obere th mit scope=col
Mengen in td
gleiche Zellenzahl

Zeilenüberschriften für benannte Datensätze

Der Name einer Zeile wird th scope="row" — oft kombiniert mit Spaltenköpfen.

Row headers with a header row

html

HTML Code

<table>
<caption>Team scores</caption>
<tr>
<th scope="col">Name</th>
<th scope="col">Points</th>
<th scope="col">Level</th>
</tr>
<tr>
<th scope="row">Ada</th>
<td>98</td>
<td>A</td>
</tr>
<tr>
<th scope="row">Lin</th>
<td>91</td>
<td>B</td>
</tr>
</table>

Beispiel Zeilen lesen

oben scope=col
Ada/Lin scope=row
Punkte in td

Scope-Karte

Nachschlagehilfe für col/row/colgroup/rowgroup.

📊 scope attribute values

Value	Typical use	Example cell
col	Header labels a column	Top “Qty” label
row	Header labels a row	Side “Ada” name
colgroup	Header for a group of columns	Advanced multi-header grids
rowgroup	Header for a group of rows	Advanced sectioned tables

Für diesen Kurs zuerst col und row meistern.

Übung

Club-Tabelle mit 3 Spalten
caption
th scope=col oben
th scope=row für Namen
kurz auf td zurück und Unterschied merken

Typische Fehler

fettes td statt th
caption außerhalb
scope bei Mischgittern vergessen
jede Zelle als th

Kurzfassung

th = echte Header
scope verbindet Spalte/Zeile
caption betitelt die Tabelle
Daten in td

🧠 Testen Sie Ihr Wissen

Bereit zum Start

Testen Sie Ihr Wissen

Fordern Sie sich mit diesem interaktiven Quiz heraus und sehen Sie, wie gut Sie das Thema verstehen

❓

Fragen

🎯

70%

Zum Bestehen

♾️

∞

Zeit

🔄

∞

Versuche

📝 Anweisungen

Lesen Sie jede Frage sorgfältig
Wählen Sie die beste Antwort für jede Frage
Sie können das Quiz so oft wiederholen, wie Sie möchten
Ihr Fortschritt wird oben angezeigt

Sprache