Welcome to HTML5-Tutorials

Our site offers a lot of HTML5 learning from absolutely beginning to advanced level.If you want to make a website with HTML,this site will completely guide you a lot.So learn HTML5 syntax and form of coding easily with this website.If you have any doubt,leave a message on us.We will return you so soon.This site includes innumerable number of references you need to do after studying their corresponding elements.

In this page,we will learn about HTML <legend> tag.

Use of <legend> tag

The <legend> tag is used to define a caption in a <fieldset> element.

Display:Block

Example of <legend> tag

    <form>
       <fieldset>
          <legend> Contact Form </legend>
          Name: <input type="text"> <br><br>
          Address: <input type="text">
       </fieldset>
    </form>

Supported Browsers.

Tag
<legend> Yes Yes Yes Yes Yes

Full Code Example

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form>
<fieldset>
<legend> Demo Contact Form </legend>
Name: <input type="text"> <br><br>
E-mail: <input type="text"> <br><br>
Address: <input type="text"> <br><br>
</fieldset>
</form>
</body>
</html>

Output

Demo Contact Form
Name:

E-mail:

Address:

<legend> tag is used as caption in <fieldset> tag.

More Reference


Adding <legend> tag helps you more attractive on your form.

Default CSS Properties of <legend> tag

legend {
display:block;
padding-left:2px;
padding-right:2px;
border:none;
}

Attribute of <legend> tag


Attribute Value Notes
align left
right
top
bottom
It defines the alignment of the caption.

Note that: The align attribute is not supported in HTML5.