Tag <caption>

Tag <caption>

Definition

Status: Aktueller Standard

Das Tag <caption> steht für caption (Beschriftung, Überschrift).

Das <caption>-Tag wird in HTML verwendet, um einer Tabelle eine Überschrift oder Beschriftung zu geben. Es ist ein semantisches Element, das die Tabelle beschreibt und in der Regel oberhalb der Tabelle angezeigt wird (standardmäßig, kann aber über CSS verändert werden). <caption> darf nur direkt als erstes Kind innerhalb eines <table>-Elements stehen und darf pro Tabelle auch nur einmal eingesetzt werden. <caption> dient auch der Barrierefreiheit - Screenreader können automatisch vorlesen und so die Tabelle verständlich machen. <caption> kommt einzig in Verbindung mit Tabellen vor.

Syntax

<caption>...</caption>

Attribute bzw. Unterelemente

align [Deprecated]

Ausrichtung festlegen:
top: oben
bottom: unten
left: links
right: rechts

Beispiele

= Tag

= Attribut

= Wert

Text

= Kommentar bzw. wichtig!

Beispiel <caption> - ---

Der Code:

<table>
  <caption>Monatsumsatz in Euro</caption>
  <tr>
    <th>Monat</th>
    <th>Umsatz</th>
  </tr>
  <tr>
    <td>Januar</td>
    <td>5000</td>
  </tr>
  <tr>
    <td>Februar</td>
    <td>7000</td>
  </tr>
</table>

Ergebnis:

Ergebnis: <caption>-Demo 1
---

Beispiel <caption> - <caption> unterhalb der Tabelle

Der Code:

Gleicher Code wie oben...

Ergebnis:

Ergebnis: <caption>-Demo 2
<caption> unterhalb der Tabelle

Mit dem Property "caption-side: bottom;" setzt man den Tabellennamen unter die Tabelle (Standard-Wert ist "top").