New Tags in HTML5

Introduction

In this article we will see the various tags that are introduced in HTML5. HTML is HyperText Markup Language (HTML). It is used to create web pages. HTML5 is not yet an official standard, and no browsers have full HTML5 support. But all major browsers (Safari, Chrome, Firefox, Opera, Internet Explorer) continue to add new HTML5 features to their latest versions.

Some of the new features/tags in HTML5 are discussed below.

Fieldset: The Fieldset is used to group various elements like textboxes into a single element in a form. The Fieldset tag is supported by all major browsers. It creates a rectangular box around the elements. To set the Fieldset we use a <fieldset> tag in our page and specify the elements which are to be grouped within the fieldset tag.

Example: In this example we create a fieldset in a form. We used the <legend> tag to define the caption for the <fieldset> element.

Code:

<html>

  <body>

    <form>

        <fieldset>

            <legend>Personal Information</legend>

                 First Name: <input type="text"/>

         <br/><br/>

                 Last Name: <input type="text"/>

          <br/><br/>

                p_Address: <input type="text"/>

       </fieldset>

    </form>

  </body>

</html>

Output:

image 1.jpg

Figcaption:
The Figcaption tag is used to define a caption of a figure element in a form. We can place this element before or after the image element. It is supported by all browers. To define a Figcaption we use a <figcaption> tag in a form.

Example: In this example we define an image with it's caption.

Code:
 

<html>

   <body>

   <p>Image with Caption </p>

    <figure>

      <img src="Penguins.jpg" alt="The Cute Penguins" width="304" height="228" />

     <figcaption>Fig.1 - A Beautiful view of the Penguins in Norway.</figcaption>

    </figure>

  </body>

</html>


Output:

image 2.jpg
Bdo:
The full form of Bdo is Bi-directional Override. It changes the direction of text that is written within this tag. The Bdo tag is used to override the current text direction. It is also supported by all browsers. We have to direction of the text it display.

Example:

Code:
 

<html>

   <body>

      <p>Example of bdo tag in left to right direction.</p>

      <p><font><bdo dir="rtl">This paragraph will go right-to-left.</bdo></font></p>

   </body>

</html>


Output:


image 3.jpg

 

Up Next
    Ebook Download
    View all
    Learn
    View all