HTML <figcaption> -Tag


Beispiel

Verwenden Sie ein <figure>-Element, um ein Foto in einem Dokument zu markieren, und ein <figcaption>-Element, um eine Bildunterschrift für das Foto zu definieren:

<figure>
  <img src="pic_trulli.jpg" alt="Trulli" style="width:100%">
  <figcaption>Fig.1 - Trulli, Puglia, Italy.</figcaption>
</figure>

Weitere „Probieren Sie es selbst“-Beispiele weiter unten.


Definition und Verwendung

Das <figcaption>Tag definiert eine Beschriftung für ein <figure> -Element.

Das <figcaption>Element kann als erstes oder letztes untergeordnetes Element des <figure>-Elements platziert werden.


Browser-Unterstützung

Die Zahlen in der Tabelle geben die erste Browserversion an, die das Element vollständig unterstützt.

Element
<figcaption> 8.0 9.0 4.0 5.1 11.0

Globale Attribute

Das <figcaption>Tag unterstützt auch die globalen Attribute in HTML .


Ereignisattribute

Das <figcaption>Tag unterstützt auch die Ereignisattribute in HTML .



Mehr Beispiele

Beispiel

Verwenden Sie CSS, um <figure> und <figcaption> zu formatieren:

<html>
<head>
<style>
figure {
  border: 1px #cccccc solid;
  padding: 4px;
  margin: auto;
}

figcaption {
  background-color: black;
  color: white;
  font-style: italic;
  padding: 2px;
  text-align: center;
}
</style>
</head>
<body>

<figure>
  <img src="pic_trulli.jpg" alt="Trulli" style="width:100%">
  <figcaption>Fig.1 - Trulli, Puglia, Italy</figcaption>
</figure>

</body>
</html>

Verwandte Seiten

HTML-DOM-Referenz: Figcaption-Objekt


Standard-CSS-Einstellungen

Die meisten Browser zeigen das <figcaption>Element mit den folgenden Standardwerten an:

figcaption {
  display: block;
}