Тег <label>
Описание
Тег <label> устанавливает связь между определенной меткой, в качестве которой обычно выступает текст, и элементом формы (<input>, <select>, <textarea>). Такая связь необходима, чтобы изменять значения элементов формы при нажатии курсором мыши на текст. Кроме того, с помощью <label> можно устанавливать горячие клавиши на клавиатуре и переходить на активный элемент подобно ссылкам.
Существует два способа связывания объекта и метки. Первый заключается в использовании идентификатора id внутри элемента формы и указании его имени в качестве атрибута for тега<label>. При втором способе элемент формы помещается внутрь контейнера <label>.
Синтаксис
<input id="идентификатор"><label for="идентификатор">Текст</label>
<label><input type="..."> Текст</label>
Атрибуты
- accesskey — Доступ к элементам формы с помощью горячих клавиш.
- for — Идентификатор элемента, с которым следует установить связь.
Закрывающий тег
Обязателен.
Пример
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Тег LABEL</title> </head> <body> <form action="handler.php"> <p><b>Lorem ipsum dolor sit amet...</b></p> <p><input type="checkbox" id="check1"><label for="check1">Lorem</label><Br> <input type="checkbox" id="check2"><label for="check2">Ipsum</label><Br> <input type="checkbox" id="check3"><label for="check3">Dolor</label><Br> <input type="checkbox" id="check4"><label for="check4">Sit amet</label></p> </form> </body> </html> |
Браузеры
IE6 не позволяет активировать поле формы при щелчке по тексту, когда поле с текстом находится внутри тега <label>.
IE до версии 8.0 включительно корректно работает с <label> только при наличии в нём текста. Если добавить изображение (<label><img src=»pic.jpg» alt=»»></label> ), то активировать поле формы щелчком по картинке нельзя.
Тег | ![]() |
![]() |
![]() |
![]() |
![]() |
---|---|---|---|---|---|
<label> | 1,0+ | 7,0+ | 1,0+ | 1,2+ | 4,0+ |