Кратко
СкопированоДобавляет заголовок в <fieldset>
, который по умолчанию оформляется браузером как текст, органично вписанный в рамку.
Пример
Скопировано<fieldset> <legend>Заголовок для группы контролов</legend> …</fieldset>
<fieldset> <legend>Заголовок для группы контролов</legend> … </fieldset>
Как понять
Скопировано<legend>
позволяет описать содержимое <fieldset>
, но семантически он не является «представителем» заголовков, хотя выполняет схожую функцию. Он не задаёт иерархию, а лишь характеризует контент внутри «своей» группы — как <label>
для соответствующего контрола.
Как пишется
Скопировано<fieldset> <legend>Заголовок для группы</legend> …</fieldset>
<fieldset> <legend>Заголовок для группы</legend> … </fieldset>
Атрибуты
СкопированоУ <legend>
нет никаких своих атрибутов, ему доступны все глобальные атрибуты.
Подсказки
СкопированоВнешний вид оформления рамки по умолчанию у <legend>
немного отличается в зависимости от браузера и операционной системы:






На практике
Скопированосоветует Скопировано
🛠 Для выравнивания положения текста часто советуют использовать атрибут align
, но он исключён из современной спецификации, а привычные CSS-правила, например, с text
с <legend>
работать не будут, т. к. у него блочный контекст, но уникальная строчно-блочная контекстная модель содержимого, которая и создаёт неповторимую обводку от <fieldset>
. Поэтому для выравнивания <legend>
относительно ширины <fieldset>
нужно использовать… внезапно margin
!
За счёт особой формы обтекания рамкой текста, это можно использовать для характерной стилизации блока и заголовка:
На собеседовании
СкопированоЭто вопрос без ответа. Вы можете помочь! Почитайте о том, как контрибьютить в Доку.