HTML - тег <legend> определяет заголовок для элемента fieldset.
Тег <legend> - синтаксис и код
Тег <legend> представлен парами. Содержимое записывается между открывающим (<legend>) и закрывающим (</legend>) тегами.
Пример группировки связанных элементов в форме:
<form>
<fieldset>
<legend>Персональная форма:</legend>
<label for="fname">Имя:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Фамилия:</label>
<input type="text" id="lname" name="lname"><br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email"><br><br>
<label for="birthday">Дата Рождения:</label>
<input type="date" id="birthday" name="birthday"><br><br>
</fieldset>
</form>
Определение и использование
- HTML - тег
<legend> определяет заголовок для группы элементов формы, сгруппированных тегом <fieldset>;
- В браузере группа элементов формы оформляется рамкой, и в эту рамку вставляется содержимое тега
<legend>;
- Обычно тег
<legend> определяется как первый элемент родительского элемента <fieldset>.
★
Примечание: тег
<legend> может указывать заголовки разделов формы, являясь альтернативой элементам заголовка
<h1>-<h6>. Создание полей формы в группах
<fieldset> с соответствующими заголовками поможет упростить использование сложных форм.
Поддержка <legend> браузерами
 |
✅ Поддерживает |
 |
✅ Поддерживает |
 |
✅ Поддерживает |
 |
✅ Поддерживает |
 |
✅ Поддерживает |
Атрибуты
Глобальные атрибуты
Тег <legend> также поддерживает глобальные атрибуты в HTML
Атрибуты событий
Тег <legend> также поддерживает атрибуты событий в HTML
Настройки CSS по умолчанию
Большинство браузеров отображают элемент legend со следующими значениями по умолчанию:
legend {
display: block;
padding-left: 2px;
padding-right: 2px;
border: none;
}
Полный список всех доступных тегов HTML см. в Справочнике по тегам HTML.
