「HTML5のfieldestタグ」の編集履歴(バックアップ)一覧はこちら
「HTML5のfieldestタグ」(2015/11/12 (木) 19:15:51) の最新版変更点
追加された行は緑色になります。
削除された行は赤色になります。
今回はHTML5のfieldestタグについて勉強してみました。~
プログラムを勉強しはじめたらフォームも勉強しようと思ったままになっていたのでフォームに関して結構知らないタグがいっぱいありました、、、~
~
*fieldestタグってなに??
fieldestタグはフォームの入力項目をグループ化する際に使用します。~
<fieldest>~</fieldest>
の中に配置されたフォーム部品は一つのグループとみなされ、ほとんどのブラウザでは細い枠線で囲まれて表示されます。~
グループに名前や説明(キャプション)を付けたい場合は、fieldestタグの中で一番最初の<legend>タグで指定します。~
*属性
fieldestタグには3つのタグが存在します。~
**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>
*実行結果
#image(width=350,fieldest_sample.png)
こんな感じになります。~
<fieldest disabled>
とするとそのグループは使えなくなります。~
~
以上
今回はHTML5のfieldestタグについて勉強してみました。~
プログラムを勉強しはじめたらフォームも勉強しようと思ったままになっていたのでフォームに関して結構知らないタグがいっぱいありました、、、~
~
*fieldestタグってなに??
fieldestタグはフォームの入力項目をグループ化する際に使用します。~
<fieldest>~</fieldest>
の中に配置されたフォーム部品は一つのグループとみなされ、ほとんどのブラウザでは細い枠線で囲まれて表示されます。~
グループに名前や説明(キャプション)を付けたい場合は、fieldestタグの中で一番最初の<legend>タグで指定します。~
*属性
fieldestタグには3つのタグが存在します。~
**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>
*実行結果
#image(width=350,fieldest_sample.png)
こんな感じになります。~
<fieldest disabled="disabled">
とするとそのグループは使えなくなります。~
~
以上