HTML/Elemente/figure

Das figure-Element ist ein semantisches Elternelement für eine zum Seiteninhalt gehörende Abbildung (Bild, Grafik, Diagramm, Tabelle, Zitat, …).

Syntax

Start-Tag: notwendig

End-Tag: notwendig

WAI‑ARIA‑Rolle

• keine

Elternelemente

Darf vorkommen in:

• Elementen mit flow content

erlaubte Inhalte

entweder

• ein figcaption-Element gefolgt von fließendem Inhalt

oder

• fließender Inhalt, gefolgt von einem figcaption-Element

Beispiel

<figure role="group">
  <img src="Selfhtml-Logo-Neu.png" alt="SelfHTML-Logo">
  <figcaption>
    Das neue SelfHTML-Logo von 2012 (<a href="#">weitere Informationen</a>)
  </figcaption>
</figure> 

<figure>
  <figcaption>Tim Berners Lee:</figcaption>
  <blockquote>
    Everyone's a publisher!
  </blockquote>
</figure>

Mit dem figure-Element können Sie einem Medienobjekt wie einer Tabelle, einer Grafik, etc eine Bildunterschrift (caption) zuordnen - die figcaption muss erstes oder letztes Kindelement sein.

Siehe auch

• HTML/Tutorials/Textstrukturierung
  figure und figcaption
• Bilder im Internet
  • Bildunterschrift vs. Bildbeschreibung
  • Bilder präsentieren
    viele Beispiele, wie man Bilder anordnen und präsentieren kann.
• CSS/Tutorials/Ausrichtung/float und clear
  Bilder im Fließtext rechts oder links floaten lassen.

Weblinks

• Spezifikation (W3C): The figure-Element
• WHATWG: figure (Screenshots von Anwendungsbeispielen)