HTML-<caption> Tag

Definition und Verwendung

<caption> Der Tag definiert den Tabellenkopf.

Der caption-Tag muss direkt nach dem table-Tag folgen. Sie können nur einen Titel für jede Tabelle definieren.

Tipp:Standardmäßig wird der Tabellenkopf zentriert über der Tabelle angezeigt. Ancak, die CSS-Attribute text-align und caption-side können verwendet werden, um den Ausrichtung und die Position des Titels zu bestimmen.

Weitere Informationen:

HTML DOM Referenzhandbuch:Caption-Objekt

Beispiel

Beispiel 1

Tabelle mit Titel:

<table>
  <caption>Monatliche Einlagen</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>¥3000</td>
  </tr>
</table>

Try It Yourself

Beispiel 2

Positionstabelle Titel (CSS verwendet):

<table>
  <caption style="text-align:right">meine Einlagen</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>¥3000</td>
  </tr>
</table>
<br>
<table>
  <caption style="caption-side:bottom">My Savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>¥3000</td>
  </tr>
</table>

Try It Yourself

Global Attributes

<caption> The tag also supports Global Attributes in HTML.

event attributes

<caption> The tag also supports Event Attributes in HTML.

Default CSS Settings

Most browsers will display the following default values <caption> Element:

caption {
  display: table-caption;
  text-align: center;
}

Try It Yourself

Browser Support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support