HTML リファレンスマニュアル

HTML タグ一覧

HTML: <fieldset> タグ

HTML <fieldset> マークアップは <form> マークアップ内に位置し、HTML フォーム内の関連要素をグループ化するために使用されます。 <legend> マークアップを使用して <fieldset> にタイトルを作成します。このマークアップは通常 <fieldset> 要素と呼ばれます。

オンラインサンプル

フォーム内の関連要素をグループ化します：

例

!doctype　html>
<html>
<head>
<meta　charset="UTF-8">
<title>HTML5　fieldsetタグの使用(基本教程網　oldtoolbag.com)</title>
</head>
<body>
<form>
　　<fieldset>
　　　　<legend>顧客情報(oldtoolbag.com)</legend>
　　　　名前:　<input　type="text"><br>
　　　　住所:　<input　type="text"><br>
　　　　電話番号:　<input　type="text">
　　</fieldset>
</form>
</body>
</html>

テストを見てみましょう ‹/›

実行後の効果は以下の通りです：

ブラウザの互換性

IEFirefoxOperaChromeSafari

すべての主要ブラウザが <fieldset> タグをサポートしています。

タグの定義及び使用説明

<fieldset> タグは、フォーム内の関連要素をグループ化できます。

<fieldset> タグは、関連するフォーム要素の周りに枠線を描画します。

ほとんどのブラウザは <fieldset> マークの周りに黒い枠を表示しますが、CSSを使用してこの動作を変更できます。

あなたは <legend> マークを使用して fieldsetのタイトルを表示できます。このタイトルは fieldset内の関連フォームコントロールの前に表示され、fieldsetの上部枠の上に浮かんで見えます。

ヒントと注意

ヒント：<legend> タグは <fieldset> 要素のタイトルを定義します。

HTML 4.01 と HTML5の差異

HTML5 中で <fieldset> の新しい属性：disabled、form、nameが追加されました：HTML 4.01 中ではこれらの属性はサポートされていません。

属性

属性	値	説明
disabledHTML5	disabled	このグループの関連フォーム要素が無効になるべきであることを指定します。
formHTML5	form_id	fieldsetが属する一つまたは複数のフォームを指定します。
nameHTML5	text	fieldsetの名前を指定します。

グローバル属性

<fieldset> タグのサポート HTMLのグローバル属性。

イベント属性

<fieldset> タグのサポート HTMLのイベント属性。

HTML: <i> タグ HTML: <embed>タグ