HTML <figcaption> element
The <figcaption> element represents the caption or legend for a <figure>. It describes the rest of the figure's contents and helps the reader understand why that figure is present.
The caption may name the image, explain a diagram, identify a chart, describe a code example, or give the source and context for a piece of self-contained content.
A <figcaption> must be a direct child of a <figure>, in the first or last position. A figure can have only one caption, although the caption itself can contain paragraphs, links, and other suitable content.
This element is different from the alt attribute on an image. The alt text is a replacement for the image when the image cannot be seen or loaded. A <figcaption> is visible caption text that gives context, title, explanation, or commentary.
In the example below, the image's alt describes the sunflower, while the caption explains why the photograph appears in this teaching material. The caption does not replace the image's text alternative.
The caption describes the whole figure, which may contain more than one image or example. Two photographs shown as a comparison can share a caption explaining their relationship. If each needs its own independent caption, separate figures may be more appropriate.
Attributes: GLOBALS.
Typical layout: <figure> <img src="/cityroad/images/revision/CSS_sunflower.jpg" alt="A yellow sunflower with a dark centre, surrounded by green leaves."> <figcaption>A sample photograph for practising CSS image styling.</figcaption> </figure>
Visual representation:
