1. Home

HTML label tag

Three radio buttons with labels

Definition and Usage

The <label> tag defines a label for several elements:

  • <input type="checkbox">
  • <input type="color">
  • <input type="date">
  • <input type="datetime-local">
  • <input type="email">
  • <input type="file">
  • <input type="month">
  • <input type="number">
  • <input type="password">
  • <input type="radio">
  • <input type="range">
  • <input type="search">
  • <input type="tel">
  • <input type="text">
  • <input type="time">
  • <input type="url">
  • <input type="week">
  • <meter>
  • <progress>
  • <select>
  • <textarea>

    • Proper use of labels with the elements above will benefit:

  • Screen reader users (will read out loud the label, when the user is focused on the element)
  • Users who have difficulty clicking on very small regions (such as checkboxes) - because when a user clicks the text within the <label> element, it toggles the input (this increases the hit area). 

    • Tips and Notes

    Tip: The for attribute of <label> must be equal to the id attribute of the related element to bind them together. A label can also be bound to an element by placing the element inside the <label> element. 

    Browser Support

    Element
    <label> Yes Yes Yes Yes Yes

    Attributes

    Attribute Value Description
    for element_id Specifies the id of the form element the label should be bound to
    form form_id Specifies which form the label belongs to

    Global Attributes

    The <label> tag also supports the Global Attributes in HTML.

    Event Attributes

    The <label> tag also supports the Event Attributes in HTML.

    Related Pages

    HTML DOM reference: Label Object

    Default CSS Settings

    Most browsers will display the <label> element with the following default values:

    Example

    label {
      cursor: default;
    }

    Categories

    HTML CSS3 Bootstrap Foundation Sass JavaScript TypeScript JQuery AngularJS React NodeJS Highcharts PHP Python Python3 Django Linux Docker Ruby Java C C ++ Perl Servlet JSP Lua Scala Go ASP C # SQL MySQL SQLite MongoDB Redis Android Swift ionic Kotlin XML tutorial

    Contact US