Тег label

"Тег label" - что такое тег label. Примеры использования + синтаксис

Подробно о теге label

1. Что такое тег label + синтаксис
2. Использование второго синтаксиса тега label
3. Атрибуты тега label

Не путать тег label и атрибут label!

Синтаксис Тега label

Значение имени id "example" должно совпадать в поле ввода и в теге label

<input id="example"><label for="example">текст</label>

Либо :

<label><input type="example"> текст</label>

Пример кода использования тега label

<form>
  <input type="checkbox" id="check1"> <label for="check1"> label 1</label><br>
  <input type="checkbox" id="check2"> <label for="check2"> label 2</label><br>
  <input type="checkbox" id="check3"> <label for="check3"> label 3</label><br>
</form>

Живой пример использования тега label

Давайте возьмем тот код, что был в примере использования тега label и выведем его здесь.

Не нажимайте по самому полю кнопки, а нажмите по строке, где сть слово "label"

label 1
label 2
label 3




Использование второго синтаксиса тега label

В приведенном выше синтаксисе тега label вы видели и второй синтаксис...

Давайте испытаем на живом примере... будет ли работать заявленные свойства в таком синтаксисе!

Для этого изменим чуть-чуть приведенный пример кода тега label:

<form>
  <label for="check01"><input type="checkbox" id="check01"> label 01</label><br>
  <label for="check02"><input type="checkbox" id="check02"> label 02</label><br>
  <label for="check03"><input type="checkbox" id="check03"> label 03</label><br>
</form>

Вывод второго синтаксиса тега label

label 01
label 02
label 03




Атрибуты тега label

У атрибута тега label есть несколько атрибутов:

Accesskey

Доступ к элементам формы с помощью горячих клавиш.

For

Идентификатор элемента, с которым следует установить связь.