html tutorial - Figure <figure> tag in HTML - html5 - html code - html form




figure tag in html

Learn html - html tutorial - figure tag in html - html examples - html programs

  • The <figure> tag is used to specifies self-contained content, like diagrams, photos, code listings, illustrations, etc.
  • The <figure> element content is related to the main flow.
  • The <figure> element position is independent of the main flow.
  • If removed the <figure>element is should not affect the document flow.
  • <figure> tag supports Global Attributes and Event Attributes.

Syntax for Figure:

<figure>Content</figure>

Differences between HTML 4.01 and HTML5

HTML 4.01

  • The HTML 4 is does not supports <figure> tag.

HTML5

  • The HTML 5 is supports <figure>tag.

Sample Coding for <figure> tag:

Tryit<!DOCTYPE html>
<html >
    <head>
        <title>Wikitechy figure tag</title>
    </head>
    <body>
        <h2>HTML figure tag with example</h2>
        <figure>
            <img src="https://www.wikitechy.com/images/logo.png"
                 alt="Wikitechy logo" width="300" height="200">
        </figure>
    </body>
</html>

Code Explanation for <figure> tag:

code explanation for figure tag

  1. The <figure>tag is used to give the image and alternative text for an image with a specific size.

Output of <figure> tag:

output for figure tag

  1. The output shows the wikitechy logo by using <figure>tag.

Browser Support for <figure> tag in HTML:

6.0 9.0 4.0 5.0 11.1
  • The <figure>element is adding a caption by using <figcaption> element.

Related Searches to figure tag in html

Adblocker detected! Please consider reading this notice.

We've detected that you are using AdBlock Plus or some other adblocking software which is preventing the page from fully loading.

We don't have any banner, Flash, animation, obnoxious sound, or popup ad. We do not implement these annoying types of ads!

We need money to operate the site, and almost all of it comes from our online advertising.

Please add wikitechy.com to your ad blocking whitelist or disable your adblocking software.

×