figure

Table of contents

  1. 1. Summary
    1. 1.1. Usage context
    2. 1.2. Attributes
    3. 1.3. DOM Interface
    4. 1.4. Examples
    5. 1.5. Compatibility
    6. 1.6. See also
Table of contents
  1. 1. Summary
    1. 1.1. Usage context
    2. 1.2. Attributes
    3. 1.3. DOM Interface
    4. 1.4. Examples
    5. 1.5. Compatibility
    6. 1.6. See also

Introduced in HTML 5

Summary

The HTML Figure Element (<figure>) represents self-contained content, frequently with a caption (<figcaption> ), and is typically referenced as a single unit. While it is related to the main flow, its position is independent of the main flow. Usually this is an image, an illustration, a diagram, a code snippet, or a schema that is referenced in the main text, but that can be moved to another page or to an appendix without affecting the main flow.

View the live example

Usage notes:

  • Being a sectioning root, the outline of the content of the <figure> element is excluded from the main outline of the document.
  • A caption can be associated with the <figure> element by inserting a <figcaption> inside it (as the first or the last child).

Usage context

Type Sectioning root
Permitted content A <figcaption> element, followed by flow content; or flow content followed by a <figcaption> element
Tag omission None, both the start tag and the end tag are mandatory
Permitted parent elements Any element that accepts flow elements.
Normative document HTML5, section 4.5.11

Attributes

This element has no other attributes than the global attributes, common to all elements.

DOM Interface

This element implements the HTMLElement interface.

Examples

<!-- Just a figure -->
<figure>
	<img src="picture.jpg" alt="An awesome picture">
</figure>

<!-- Figure with figcaption -->
<figure>
	<img src="picture.jpg" alt="An awesome picture">
		
	<figcaption>Caption for the awesome picture</figcaption>
</figure>

Compatibility

  • Desktop
  • Mobile

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 8 4.0 (2.0) 9.0 11.10 5.1
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 3.0 4.0 (2.0) 9.0 11.0 5.1 (iOS 5.0)

See also

Tags (4)

Edit tags

Attachments (1)

FileSizeDateAttached by 
 figure.html
Example for figure and figcaption
2.96 kB20:29, 9 Mar 2012Vikash AgrawalActions

Attach file