Тег <legend>: общее название группы полей
Legend задаёт подпись группы fieldset. Он особенно полезен там, где несколько переключателей отвечают на один общий вопрос, а каждый вариант имеет собственную короткую подпись.
Назначение
Legend задаёт подпись группы fieldset. Он особенно полезен там, где несколько переключателей отвечают на один общий вопрос, а каждый вариант имеет собственную короткую подпись.
Как это работает
В обычной группе формы помещайте legend первым дочерним элементом fieldset. Общая подпись объясняет вопрос, а label рядом с каждым input — конкретный ответ. Эти подписи дополняют друг друга.
Пример
<fieldset>
<legend>Как показывать примеры?</legend>
<label><input type="radio" name="preview" value="open" checked> Развёрнутыми</label>
<label><input type="radio" name="preview" value="closed"> Свёрнутыми</label>
</fieldset>Что должно получиться
Переключатели объединены одной темой и одним name. Пользователь может выбрать только один ответ. Стандартная рамка fieldset необязательна для смысла, но подпись группы должна оставаться понятной.
Граница применения и частая ошибка
Заголовок над набором полей не всегда заменяет их программную группировку. Не делайте legend слишком длинным: повторяющееся объявление большой инструкции может мешать. Подробную подсказку можно вынести в отдельный текст с корректной связью.
Самостоятельная проверка
Сравните форму с legend и без него, читая вопрос и варианты вне визуального контекста. Проверьте перемещение между радиокнопками клавишами стрелок. Затем добавьте вторую группу с другим name и убедитесь, что ответы независимы.
HTML и CSS можно изменить в песочнице ниже. Она изолирована: JavaScript, внешние ресурсы и отправка форм отключены. Проверки печати, загрузки файлов и сетевых ответов выполняйте в отдельном учебном проекте.