HTML Figure Tag

HTML Figure TagHTML Figure tag <figure> is used to specify a unit like image, diagram, photos etc.

Whatever be the content in the HTML Figure tag <figure> it should be associated to the main content neighboring it.

Also the position of the HTML figure tag is independent of the flow in the HTML resource or document, which means that, if the HTML figure tag is removed from the HTML resource or webpage then also the flow of the webpage remains the same.

HTML 5 Figure tag <figure>is a closed tag and needs closing HTML 5 figure tag </figure>

HTML 5 figcaption Tag is used with the HTML Figure tag for providing caption to the figures.

Note: Figure tag is new in HTML 5.


 HTML Figure Tag Syntax

<figure>
Some figure here..
</figure>

 HTML Figure Tag Example

HTML Figure Tag Code Output
<p>Earth is the third planet from the Sun,
and fifth-largest of the eight planets
in the Solar System.
It is sometimes referred to as
the world or the Blue Planet.
</p><figure>
<img src="Earth.jpg" alt="The Earth"
width="304" height="228">
<figcaption> Blue Planet: The Earth</figcaption>
</figure>
Earth is the third planet from the Sun, and fifth-largest of the eight planets in the Solar System. It is sometimes referred to as the world or the Blue Planet.

The Earth
Blue Planet: The Earth

In the HTML figure tag example above note how we have used the HTML Figure tag to embed the image of earth.

Also, note the use of HTML Figcaption Tag <figcaption> to provide Caption to image of Earth.

HTML Figure Tag supports all HTML Global Attributes and HTML Event Attributes.


HTML Figure Tag Supporting Browsers

S. No. Browser Supported(Yes/No)
1 Internet Explorer Yes (From IE 9 Onwards)
2 Firefox Yes
3 Google Chrome Yes
4 Opera Yes
5 Safari Yes

Tagged , , , , , , , , , , , , , , . Bookmark the permalink.