HTML の <fieldset> 要素は label 要素 (<label>) のような役割に加え、フォーム内部品のグループ化の働きをします。

コンテンツカテゴリー フローコンテンツ区分化ルートリスト化フォーム関連要素、知覚可能コンテンツ
許可されている内容 任意の <legend> 要素と、それに続くフローコンテンツ
タグの省略 不可。開始と終了タグの両方が必要。
許可されている親要素 フローコンテンツを受け入れるすべての要素
許可されている ARIA ロール group, presentation
DOM インターフェイス HTMLFieldSetElement

メモ: 他のほとんどの要素と異なり、WHATWG HTML Rendering 仕様書では <fieldset> の既定のスタイルに min-width: min-content を含めることを勧めており、多くのブラウザがこのスタイル (またはよく似たスタイル) を実装しています。

メモ: <fieldset> 要素は、新たなブロック整形文脈を作るものであると想定されています (HTML5 仕様書 を参照)。

属性

この要素にはグローバル属性があります。

disabled HTML5
この論理型属性が指定されている場合、その子孫要素として配置したフォームコントロールは <legend> を除いてすべて無効となり、編集不能となります。これらはマウスクリックやフォーカス等で発生するような、ブラウザーのすべてのイベントを受け付けなくなります。
form HTML5
関連する <form> 要素の id 属性を指定し、これと自身を結び付けます。(関連する form 要素の子孫要素として配置されている場合、)初期値は祖先要素の内で直近の <form> 要素の id となります。
name HTML5
グループに関連付けられた名前です。
fieldset 要素自身のラベルの役割は、その最初の子要素として配置した <legend> 要素が担います。

fieldset、legend、label を持つフォーム

<form action="test.php" method="post">
  <fieldset>
    <legend>Title</legend>
    <input type="radio" id="radio">
    <label for="radio">Click me</label>
  </fieldset>
</form>

仕様策定状況

仕様書 策定状況 コメント
HTML Living Standard
<fieldset> の定義
現行の標準 fieldset 要素を定義
HTML Living Standard 現行の標準 fieldset および legend 要素のデフォルトレンダリング方法を提案
HTML5
<fieldset> の定義
勧告  
HTML 4.01 Specification
<fieldset> の定義
勧告 初回定義

ブラウザーの対応

機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本対応 あり あり あり あり あり あり
disabled あり あり あり あり1126
form あり あり あり あり あり あり
name あり あり あり あり あり あり
機能Android webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
基本対応 あり あり あり あり あり あり あり
disabled4.4 あり あり ? ?6 あり
form あり あり あり あり あり あり あり
name あり あり あり あり あり あり あり

1. Not all form control descendants of a disabled fieldset are properly disabled in IE11; see IE bug 817488: input[type='file'] not disabled inside disabled fieldset and IE bug 962368: Can still edit input[type='text'] within fieldset[disabled].

関連バグ

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09, yuheiy, yyss, ethertank
最終更新者: mfuji09,