Атрибут for HTML тега <label>

HTML тег <label>

Значение и применение

Атрибут for (HTML тега <label>) определяет к какому элементу формы относится текущая метка (в том же документе).

Поддержка браузерами

АтрибутChrome
Chrome
Firefox
Firefox
Opera
Opera
Safari
Safari
Internet Explorer
IExplorer
Microsoft Edge
Edge
forДаДаДаДаДаДа

Синтаксис:

<label for = "element_id">

Значения атрибута

ЗначениеОписание
element_idЗначение глобального атрибута id того элемента формы, к которому будет относится метка.

Отличия HTML 4.01 от HTML 5

Нет.

Пример использования

Чтобы определить к какому элементу формы относится текущая метка, необходимо использовать атрибут for тега <label>. Значение атрибута for должно соответствовать значению глобального атрибута id того элемента формы, к которому будет относится метка. Атрибут for можно не использовать, если элемент <input> будет находиться внутри элемента <label> (пример рассмотрен ниже).

<!DOCTYPE html>
<html>
<head>
<title>Пример использования HTML тега <label> </title>
</head>
<body>
	<form>
		<label for = "yes">Да</label> <!--Здесь мы создаём метку для тега input c id =yes-->
		<input type = "radio" id = "yes" name = "choice" value = "yes" checked> 
		<label for = "no">Нет</label><!--Здесь мы создаём метку для тега input c id =no-->
		<input type = "radio" id = "no" name = "choice" value = "no">
	</form>
	<br>
	<form>
		<label>Да <input type = "radio" name = "choice2" value = "yes"> </label><!--Здесь мы  помещаем теги <input>
		внутрь тегов <label> (при этом атрибут for не требуется)-->
		<label>Нет <input type = "radio"name = "choice2" value = "no"checked> </label> 
	</form> 
</body>
</html>

В браузере оба варианта отображаются идентично:

Пример использования HTML тега <label> (использование текстовой метки).
Пример использования HTML тега <label> (использование текстовой метки).
HTML тег <label>
×

Кажется, вы используете блокировщик рекламы :(

Этот ресурс не является коммерческим проектом и развивается на энтузиазме автора сайта, который посвящает все свое свободное время этому проекту.

Добавьте, пожалуйста, basicweb.ru в исключения блокировщика рекламы, этим вы поможете развитию проекта.