caption-side

Die CSS Eigenschaft caption-side positioniert den Inhalt einer <caption> einer Tabelle auf der angegebenen Seite.

Syntax

/* Directional values */
caption-side: top;
caption-side: bottom;

/* Warning: non-standard values */
caption-side: left;
caption-side: right;
caption-side: top-outside;
caption-side: bottom-outside;

/* Global values */
caption-side: inherit;
caption-side: initial;
caption-side: unset;

Die Eigenschaft caption-side property wird als einer der unten aufgef├╝hrten Schl├╝sselwortwerte angegeben.

Werte

top
Die ├ťberschriftenbox soll oberhalb der Tabelle positioniert werden.
bottom
Die ├ťberschriftenbox soll unterhalb der Tabelle positioniert werden.
left
Die ├ťberschriftenbox soll links von der Tabelle positioniert werden.
Hinweis: Dieser Wert wurde f├╝r CSS 2 vorgeschlagen, aber aus der endg├╝ltigen CSS 2.1-Spezifikation entfernt. Er ist nicht standardisiert.
right
Die ├ťberschriftenbox soll rechts von der Tabelle positioniert werden.
Hinweis: Dieser Wert wurde f├╝r CSS 2 vorgeschlagen, aber aus der endg├╝ltigen CSS 2.1-Spezifikation entfernt. Er ist nicht standardisiert.
top-outside
Das ├ťberschriftenbox sollte oberhalb der Tabelle positioniert werden, w├Ąhrend die Breite und das horizontale Ausrichtungsverhalten nicht an das horizontale Layout der Tabelle gebunden sind.
Die CSS 2.1-Spezifikation stellt fest, dass die CSS 2-Spezifikation ein anderes Verhalten f├╝r den top Wert beschrieben hat, der in einer zuk├╝nftigen Spezifikation durch diesen Wert wieder eingef├╝hrt wird.
bottom-outside
Das ├ťberschriftenbox sollte unterhalb der Tabelle positioniert werden, w├Ąhrend die Breite und das horizontale Ausrichtungsverhalten nicht an das horizontale Layout der Tabelle gebunden sind.
Die CSS 2.1-Spezifikation stellt fest, dass die CSS 2-Spezifikation ein anderes Verhalten f├╝r den bottom Wert beschrieben hat, der in einer zuk├╝nftigen Spezifikation durch diesen Wert wieder eingef├╝hrt wird

Formale Definition

Initialwerttop
Anwendbar auftable-caption Elemente
VererbtJa
Berechneter Wertwie angegeben
Animationstypdiskret

Formale Syntax

top | bottom | block-start | block-end | inline-start | inline-end

Beispiele

Setzen von Beschriftungen oben und unten

HTML

<table class="top">
  <caption>Caption ABOVE the table</caption>
  <tr>
    <td>Some data</td>
    <td>Some more data</td>
  </tr>
</table>

<br>

<table class="bottom">
  <caption>Caption BELOW the table</caption>
  <tr>
    <td>Some data</td>
    <td>Some more data</td>
  </tr>
</table>

CSS

.top caption {
  caption-side: top;
}

.bottom caption {
  caption-side: bottom;
}

table {
  border: 1px solid red;
}

td {
  border: 1px solid blue;
}

Ergebnis

Spezifikationen

Spezifikation Status Kommentar
CSS Logical Properties and Values Level 1
Die Definition von 'caption-side' in dieser Spezifikation.
Bearbeiterentwurf Definiert die oberen top und unteren bottom Werte relativ zum Schreibmodus writing-mode Wert.
CSS Level 2 (Revision 1)
Die Definition von 'caption-side' in dieser Spezifikation.
Empfehlung Urspr├╝ngliche Definition

Browser Kompatibilit├Ąt

BCD tables only load in the browser