フォーム

`<fieldset>` 入力欄をまとめる

重要度3 / 5

意味

関連する入力欄をひとまとまりにする場合に使います。ラジオボタンやチェックボックスのように、複数の選択肢で1つの質問に答える場面で使います。まとまりの名前は <legend> で書きます。

コード

HTML

<fieldset>
  <legend>ご希望の連絡方法</legend>
  <label><input type="radio" name="contact" value="mail"> メール</label>
  <label><input type="radio" name="contact" value="tel"> 電話</label>
</fieldset>

プレビュー（初期表示）

ブラウザ対応

主要ブラウザの対応状況
ブラウザ	対応
Chrome	1〜
Firefox	1〜
Safari	≤4〜
Edge	12〜
Chrome Android	18〜
Safari iOS	≤3.2〜

出典: MDN Web Docs（`@mdn/browser-compat-data`）