<fieldset>の解説|クロノドライブのHTML辞典

<fieldset>

対応ブラウザ Internet Explorer 4~ Firefox 1~ Google Chrome 1~ Safari 1~ Opera 6~
タグの分類 ブロックレベル要素 定義バージョン Strict, Transitional, Frameset
開始タグ 必須 終了タグ 必須
用例
<form method="post" action="sample.cgi">
  <fieldset>
    <legend>データ1</legend>
    <p>名前<input type="text" name="name1" size="10"></p>
    <p>住所<input type="text" name="address1" size="30"></p>
  </fieldset>
  <fieldset>
    <legend>データ2</legend>
    <p>名前<input type="text" name="name2" size="10"></p>
    <p>住所<input type="text" name="address2" size="30"></p>
  </fieldset>
  <input type="submit" value="送信">
</form>

<fieldset>とは

「FIELDSET」とは、<form>タグで定義するフォームの入力項目をグループ化するためのタグです。
グループ化を行うことにより、グループの間をtabキーで簡単に移動することが可能になります。

<legend>タグでグループ化されたフォームにタイトルを付けることが可能です。
似た関係性を持つものとして<table>タグと<caption>タグがあります。

サンプルデモ

		<form method="post" action="sample.cgi">
			<fieldset>
				<p><legend>データ1</legend></p>
				<p>名前<input type="text" name="name1" size="10"></p>
				<p>住所<input type="text" name="address1" size="30"></p>
			</fieldset>
			<fieldset>
				<p><legend>データ2</legend></p>
				<p>名前<input type="text" name="name2" size="10"></p>
				<p>住所<input type="text" name="address2" size="30"></p>
			</fieldset>
			<input type="submit" value="送信">
		</form>
	

データ1

名前

住所

データ2

名前

住所