HTML5のfieldestタグ - nicepaper @ ウィキ

今回はHTML5のfieldestタグについて勉強してみました。
プログラムを勉強しはじめたらフォームも勉強しようと思ったままになっていたのでフォームに関して結構知らないタグがいっぱいありました、、、

fieldestタグってなに？？

fieldestタグはフォームの入力項目をグループ化する際に使用します。

<fieldest>～</fieldest>

の中に配置されたフォーム部品は一つのグループとみなされ、ほとんどのブラウザでは細い枠線で囲まれて表示されます。
グループに名前や説明(キャプション)を付けたい場合は、fieldestタグの中で一番最初の<legend>タグで指定します。

属性

fieldestタグには３つのタグが存在します。

disabled属性

この属性を指定するとフォーム内のすべての部分が無効になります。

form属性

formのidを指定する事で、そのフォームと関連付ける事ができます。
ウェブアプリを作るときに、親フォームなどの位置を気にすることなくフォームを指定できるので便利です。

name属性

fieldestに名前を付ける事ができます。
スクリプト操作の時に有効です。

HTML

<form action="sample.php" method="post">
<p><label for="namae">名前：</label><input type="text" name="name" id="namae" size="40"></p>
<fieldset>
<legend>性別</legend>
<p><label for="dansei">男性</label><input type="radio" name="sex" id="dansei" value="male"></p>
<p><label for="jyosei">女性</label><input type="radio" name="sex" id="jyosei" value="female"></p>
</fieldset>
<fieldset>
<legend>休日の過ごし方</legend>
<p><label><input type="checkbox" name="hobby" value="syugyo">修行</label></p>
<p><label><input type="checkbox" name="hobby" value="sleeping">睡眠</label></p>
<p><label><input type="checkbox" name="hobby" value="writting">プログラムを書く</label></p>
<p><label><input type="checkbox" name="hobby" value="boo">ボーっとする</label></p>
</fieldset>
<p><input type="submit" value="送信"><input type="reset" value="リセット"></p>
</form>

実行結果

こんな感じになります。

<fieldest disabled="disabled">

とするとそのグループは使えなくなります。

以上