Figure HTML

by

HTML <figure> Tag

To mark up an image on a web page and to handle the group of diagrams, photos, code listing, etc. with some embedded content, the HTML <figure> tag is used. It was introduced in HTML5. The content of this tag is related to the main flow. However, the position of the HTML <figure> tag is independent of the main flow. Thus, when removed, the flow of the document is not affected.

Example:

<!DOCTYPE html>
<html>
<body>
<h2>Example:</h2>
<figure>
    <img src="img.jpg" alt="Fly" width=300 height=200>
    <figcaption>Fig.1 - Fly high in the sky.</figcaption>
  </figure>
</body>
</html>

Explanation:

In the above example, we are using the HTML <figure> tag, to mark up an image on a web page.

Global Attributes:

The HTML GLobal attributes are supported by the HTML <figure> tag.

Event Attributes:

The HTML Event attributes are supported by the HTML <figure> tag.

Supporting Browsers:

Chrome, IE, Firefox, Opera, and Safari.