HTML тег `<fieldset>`

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

Тег <fieldset> служит для визуальной группировки элементов, размещенных внутри формы (HTML тег <form>).

Попробуйте fieldset в тренажёре HTML-форм: настройте поле, проверьте ввод и разберите результат.

Во всех основных браузерах, данный элемент выделяется рамкой, а содержимое элемента получает внутренние отступы со всех сторон. Чтобы указать заголовок для элемента <fieldset> необходимо использовать тег <legend>.

Группа имеет смысл, а не только рамку: <legend> в начале <fieldset> даёт общее название связанным полям, например «Удобное время прогулки» для радиокнопок. У каждого отдельного поля при этом остаётся своя метка.

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

Спецификация: multipage

Поддерживается во всех основных браузерах с 2015 года.

ВсеКомпьютерыМобильные

Совместимостьhtml.elements.fieldset
Возможность	Компьютеры					Мобильные
Возможность	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on iOS	Samsung Browser	WebView Android	WebView on iOS
`fieldset`	✓1	✓12	✓1	✓≤15	✓≤4	✓18	✓4	✓≤14	✓≤3.2	✓1.0	✓4.4	✓≤3.2
`disabled`	✓20	✓79	✓4	✓12	✓6	✓25	✓4	✓12	✓6	✓1.5	✓4.4	✓6
`form`	✓1	✓12	✓1	✓15	✓3	✓18	✓4	✓14	✓2	✓1.0	✓4.4	✓2
`name`	✓19	✓12	✓4	✓15	✓6	✓25	✓4	✓14	✓6	✓1.5	✓4.4	✓6
Ещё 3 значений · поддерживаются везде более 3 летСвернуть

поддерживаетсяс ограниченияминет поддержкинет данных≤31 — не позднее версии 31

Атрибуты

Атрибут	Значение	Описание
`disabled`	`disabled`	Отключает вложенные элементы управления, кроме находящихся внутри первого дочернего `<legend>`. Отключённые поля не отправляются и не участвуют в проверке формы.
`form`	`form_id`	Идентификатор одной формы в том же документе. Связь самого `<fieldset>` с формой не назначает её автоматически всем вложенным полям, расположенным вне формы: им также может понадобиться собственный `form`.
`name`	`text`	Имя группы для обращения из скрипта; собственное значение группы не отправляется как поле формы.

Примеры, попробуйте сами

Группа полей

Измените legend или добавьте disabled к fieldset.

index.html

HTML

<form>
  <fieldset>
    <legend>Контакты</legend>
    <p>
      <label>Имя <input name="user" /></label>
    </p>
    <p>
      <label>Почта <input name="email" type="email" /></label>
    </p>
  </fieldset>
</form>

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

В HTML 5 были введены три новых атрибута для элемента.

Значение CSS по умолчанию

CSS

fieldset {
display : block;
margin-left : 2px;
margin-right : 2px;
padding-top : 0.35em;
padding-bottom : 0.625em;
padding-left : 0.75em;
padding-right : 0.75em;
border : 2px groove (может различаться в некоторых браузерах);
}

Поддержка глобальных атрибутов

Элемент поддерживает "глобальные атрибуты".

Атрибуты событий

Элемент поддерживает "атрибуты событий".

HTML тег <fieldset>