html tutorial - Label <label> tag in HTML - html5 - html code - html form

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

The <label> tag is used to create a caption for the Input element.
When the user clicks on the text within <label> tag that toggles the specified control.
The <label>tag supports the Global Attributes and Event Attribute.
The <label> tag belongs to Flow content, phrasing content, interactive content, form-associated element, palpable content Categories.

Syntax for <label> tag:

<label>content</label>

Differences between HTML 4.01 and HTML5 for <label> tag

HTML 4.01

In HTML4 does not support “form” attribute.

HTML5

The “form” attribute is new in HTML5.

Sample Coding for <label> tag:

Tryit<!DOCTYPE html>
<html >
    <head>
        <title>Wikitechy label tag</title>
    </head>
    <body>
        <h2>Wikitechy Tutorials</h2>
        <form>
            <input type="radio" name="tutorial" id="php">
            <label for="php">Wikitechy PHP<label><br>
            <input type="radio" name="tutorial" id="html">
            <label for="html">Wikitechy HTML <label><br>
            <input type="radio" name="tutorial" id="css">
            <label for="css">Wikitechy CSS </label><br><br>
            <input type="submit" value="Submit">
        </form>
    </body>
</html>

Code Explanation for <label> tag:

The id=”php” used to declare the id for the <input> tag.
<label> tag used to define a caption.
for attribute is used to map the label caption to the <input> which has the id as “php”.

Output of <label> tag:

The output displays list of “Wikitechy Tutorials” radio button along with its label caption.

output for label tag toggles radio button

When user clicks the “Wikitechy HTML” label that toggle the radio button.

Attribute for <label>tag:

Attribute	Value	HTML4	HTML5	Description
for	element_id	Yes	Yes	It specifies which form element a label is bound to
form	form_id	No	Yes	It specifies one or more forms the label belongs to

Browser Support for <label> tag in HTML:


Yes	Yes	Yes	Yes	Yes

Tips and Notes:

A label element can have both a “for” attribute and a contained control element, the for attribute points to the contained control element.

PDF

Related Searches to label tag in html

form html label for css html label width html labelfor label bootstrap form label label form html form label form label html html tutorialshtml editor html code html form html tutorial html color html color codes html table html img html5 html code for website html and css html programs html website free html editor html5 tutorial wysiwyg html editor html tutorial pdf html converter php tutorial html example html tutorial css tutorial html css html tags html basics code html html online html mailto html lang html tags list