Home Tutorial Html Html5 HTML5 <label> element, Introduction of <label>tag.

 
 

Share on Google+Share on Google+
HTML5 <label> element, Introduction of <label>tag.
Posted on: September 9, 2010 at 12:00 AM
Advertisement
In this section, you will see the use and implementation of <label> tag.

HTML5 <label> element, Introduction of <label> tag.

Description:

Here, we will introduce you to about the label. The <label> tag is use for adding caption on control. It works as name on form controls. It does not supports for nested label.

Attributes of form:
It supports "for" attribute. The for attribute tells to user, that the label tag related to this controls of form, and the value of for attribute should be equal to the id of form control.
OR
It identifies the related controls.

Attribute Value Description
for id of related control It specifies related control of form.
form id of  related  form Identify the form from which it is related.


Declaration Syntax :

Declaration syntax of label in HTML5.

                           <label for="" form=""> Text</label>

Example of <label> in HTML5:

Code:
LabelTag.html
<!DOCTYPE html >
<html>
<head>
<title>Title of document</title>
</head><body>
<h2>Implementation of label tag of HTML5.</h2>
<form id="GenderForm"><table style="width: 49%">
<tr> <td><label for="married"><b>Married</b> </label></td>
<td><input type="radio" name="gender" id="married" /></td></tr>
<tr><td> <label for="unmarried"><b>Bachelor</b></label></td>
<td><input type="radio" name="gender" id="unmarried" /></td>
</tr>
<tr><td> <label id="age"><b>Age</b></label></td>
<td><input type="text" id="age" /></td></tr>
<tr><td> <label for="button" >Submit</label> </td>
<td> <input type="submit" id="button" /></td></tr> </table>
</form></body>
</html>
Output:

Download this code

Difference Between HTML5 and HTML4.01:

The label tag is available in both HTML5 and HTML4.01. But there is a form attribute in HTML5, that is not supported by HTML4.01.

Advertisement

Related Tags for HTML5 <label> element, Introduction of <label>tag.:


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: September 9, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com