В чем преимущества использования тега fieldset?

Ответ 1

Формы часто разбиваются на различные наборы полей.

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

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

Точно так же, как формы, которые вы находите в "реальном" мире.

"Преимущества" использования набора полей - это то, что они позволяют вам пометить ваши данные (в данном случае форму) самым доступным семантическим способом. Учтите, что размещение полей в наборе полей более наглядно, чем размещение полей в div. Div ничего не говорит о взаимосвязи между полями, набор полей говорит вам, что существует взаимосвязь.

Это аналогичный принцип для многих новых тегов HTML5. <footer>, например, расскажет вам больше о значении данных внутри него по сравнению с двусмысленным <div>.

Ответ 2

Если вы посмотрите на спецификацию HTML5 для разработчиков:

http://developers.whatwg.org/forms.html#the-fieldset-element

Элемент fieldset представляет собой набор элементов управления формами, необязательно сгруппированных под общим именем.

(если вы переходите по ссылке),

В сочетании с элементом legend, это позволяет вам легко сделать это, что трудно воссоздать без использования fieldset/legend:

Ответ 3

Он позволяет группировать набор связанных полей и давать им легенду.

<fieldset>
    <legend>Gender</legend>
    <input type="radio" name="gender" id="male" value="male">
    <label for="male">Male</label>
    <input type="radio" name="gender" id="female" value="female">
    <label for="female">Female</label>
<fieldset>

<fieldset>
    <legend>Address</legend>

    <label for="line1">Line 1</label>
    <input name="address1" id="line1">

    <label for="line2">Line 2</label>
    <input name="address2" id="line2">

    <label for="town">Town</label>
    <input name="town" id="town">

    <label for="country">country/label>
    <input name="country" id="country">
</fieldset>

Ответ 4

Вы группируете материал вместе с ним. Это полезно, если вам нужно получить доступ к вещам в нем для CSS или JavaScript и не хотите, чтобы вы столкнулись с проблемой назначения идентификатора ко всему.

Кроме того, легенда выглядит довольно хорошо.