Home Whiteboard Graphing Calculator Online Compilers Articles Tools
Tutorials Courses Jobs

Create self-contained content in HTML5

HTML5 Web Development Front End Technology

The

element in HTML5 is used to display self-contained content (images, videos, etc). This can be attached to the main program, and can be used at any place within the document without impacting the flow of document. Additionally, if we remove the
tag, it won?t affect the structure of the document.

Syntax

The usage of

tag in HTML is shown below ?

 Image content...

The parameters used in the

caption are img, src and figcaption.

The tag is used to specify the image source URL when we are including an image and it?s caption.

and
elements are used to group the image and provide a caption to it. The browsers display?s the
element by using default CSS settings -

figure {
   display: block;
   margin-top: 1em;
   margin-bottom: 1em;
   margin-left: 40px;
   margin-right: 40px;
}

Now, let us see some examples, which demonstrate the usage of self-contained content element in HTML.

Example

In the following example, we are using the

tag to create self-contained content -




   


   
Usage of Self-Contained Content Element

   

      Trulli
      
Fig.1 - flowers,India

Example

Following is another example which shows usage of

tag using CSS ?




   


   
A figure element is displayed like this:

   

      The Pulpit Rock
   

   
Change the default CSS settings to see the effect.

Example

Let us see another example ?




   HTML figure Tag


   
Tutorialspoint Coding Ground
Updated on: 2023-10-06T16:03:48+05:30

847 Views

Learn More in Our Tutorials

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements