Тег <fieldset> HTML группа полей

Рейтинг: 4 из 5, голосов 2
++++-

Тег <fieldset> в HTML используется для объединения нескольких элементов HTML формы в группу.

Элементы формы, объединенные в группу с помощью тега <fieldset>, как правило, выделяются браузерами с помощью квадратной рамки.

С помощью тега <legend> можно указать название группы (подпись).

С помощью атрибута disabled тега fieldset можно отключить сразу все поля в группе.

Тег <fieldset> HTML является элементом формы. Подробно о создании форм описано в статье: Все про формы и поля в HTML. Создание и работа с формами.

Синтаксис

<fieldset>контент</fieldset>

Отображение в браузере

Контактные данные ФИО:

Email:

Телефон:

Пример использования группы полей <fieldset> в HTML коде

<!DOCTYPE html>
<html>
<head>
<title>Пример использования группы полей fieldset</title>
</head>
<body>
<fieldset>
<legend>Контактные данные</legend>
ФИО: <input type="text" name="name"><br><br>
Email: <input type="email" name="email"><br><br>
Телефон: <input type="tel" name="phone">
</fieldset>
</body>
</html>

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

Тег Google Chrome Internet Explorer Mozilla FireFox Safari Opera
<fieldset> Да Да Да Да Да

Атрибуты тега fieldset

Атрибут Значения Описание
disabled не указывается / disabled

Логический атрибут. Если указан, делает группу полей неактивной.

Данные полей группы, отмеченной этим атрибутом, не будут переданы на сервер при отправке формы. Также отключает возможность ввода в поля группы.

form id формы

Указывает на форму, к которой относится группа полей (поля группы будут привязаны к указанной форме). Используется, если группа полей находится вне HTML кода формы.

Если группа полей находится внутри тега <form>, то использовать атрибут form не нужно, поля по умолчанию привязаны к форме, внутри которой находятся.

Этот атрибут не поддерживается многими браузерами! Используйте атрибут form в тегах полей (элементов) формы.

name текст

Имя группы полей.

Тег <fieldset> также, поддерживает глобальные HTML атрибуты.

Оцените, насколько полезна эта страница
++++-
Оставьте комментарий

Отправляя форму, я даю согласие на обработку персональных данных.