fieldset 要素フォームの内容をまとめる

fieldset 要素はフォームの内容をまとめます。

fieldset 要素によってまとめられたフォームの内容グループには、legend 要素によって見出しを付与することができます。legend 要素は、fieldset 要素の最初の子要素として記述される必要があります。HTML5 において、legend 要素は任意の要素です。

さらに詳細な説明を見る

サンプルソースを見る

fieldset 要素の仕様

カテゴリ
コンテンツモデル

任意で legend 要素を 1つ

この要素を使用できる文脈

フロー・コンテンツが期待される場所

この要素で使用できる属性
DOM インタフェース
interface HTMLFieldSetElement : HTMLElement {
           attribute boolean disabled;
  readonly attribute HTMLFormElement? form;
           attribute DOMString name;

  readonly attribute DOMString type;

  readonly attribute HTMLFormControlsCollection elements;

  readonly attribute boolean willValidate;
  readonly attribute ValidityState validity;
  readonly attribute DOMString validationMessage;
  boolean checkValidity();
  void setCustomValidity(DOMString error);
};

詳細説明

disabled 属性

disabled 属性が指定されると、その fieldset 要素の子孫となる入力コントロールのすべてが無効になります。

form 属性

任意の form 要素に付与した id 属性値を、fieldset 要素の form 属性値として指定することで、そのフォームと、fieldset 要素によってグルーピングされた入力コントロールを関連づけることができます。

対応するブラウザであれば、form 要素の外に fieldset 要素があったとしても、送信などが可能になります。

name 属性

fieldset 要素に名前を付与します。

fieldset 要素のサンプルソース

<fieldset>
 <legend>お客様情報</legend>
 <p>
  <label for="name">お名前</label> <input tyle="text" name="name" id="name" value="" />
 </p>
 …省略…
</fieldset>
<fieldset>
 <legend>アンケート</legend>
 <p>
  …省略…
 </p>
 …省略…
</fieldset>

W3C HTML5 仕様書

4.10.4 The fieldset element