<figure> element – includes images, diagrams or photos which are relevant to the main content of the page. The <figcaption> element is used to add a caption to the image.
Usage: these elements are used in combination to support increased accessibility and greater clarity regarding the content of associated images or diagrams. The <figcaption> element is optional and should be included either as the first child or the last child of the <figure> element.
Permitted Content: one <figcaption> element (as either the first child or last child) and appropriate flow elements (such as <img>).
Tag omission: both start and end tag must be present for both <figure> and optional <figcaption> elements.
Example code:
<figure>
<img src=”../orchid.jpg” alt=”orchid blossom” height=”150″ width=”200″ />
<figcaption>A close-up of an orchid taken at the Changi Airport in Singapore.</figcaption>
</figure>
Example page (opens in a new tab/ window – view source code): http://learning-html5.info/examples/ExampleFigure.html
Default display properties: display: block.
Common Attributes: typical global attributes only.
Permitted Parent Elements: any element which can contain phrasing or flow elements.
References: http://dev.w3.org/html5/markup/figure.html#figure and http://dev.w3.org/html5/markup/figcaption.html
Loading ...