フォーム - フィールド
fieldset
フォーム要素のグループ化
2008/3/26
構文
<fieldset> ~ </fieldset>
説明
fieldset要素は、ログイン情報、個人情報など、フォーム要素を入力する情報によって、フォーム要素をグループ化するブロック要素です。 グループにタイトルを付ける場合は、legend要素を使用します。
属性
固有の属性はありません。
属性="値" | 説明 | サポート状況 | 必須・任意 | 代替 | |
---|---|---|---|---|---|
XHTML 1.0 | XHTML 1.1 | ||||
一般属性 | - | STF | S | 任意 | style属性はCSSで代替。 |
サンプル
<style type="text/css"> form#member fieldset { margin:1em 0; padding:0 10px 10px 10px; border:1px solid #ccc; } form#member legend { margin:0; padding:0 5px; font-weight:bold; } </style> <form action="#" id="member"> <fieldset> <legend>ログイン情報</legend> <p><label for="login_id">ユーザー名:</label><input type="text" name="login_id" id="login_id" /></p> <p><label for="login_pw">パスワード:</label><input type="password" name="login_pw" id="login_pw" /></p> </fieldset> <fieldset> <legend>個人情報</legend> <p> <label for="name">氏名:</label> <input id="name" /> </p> <p> <label for="postcode">郵便番号:</label> <input id="postcode" /> </p> <p> <label for="address">住所:</label> <input id="address" /> </p> <p> <label for="email">E-mail:</label> <input id="email" /> </p> <fieldset> <legend>メルマガを購読しますか?</legend> <p> <label><input type="radio" name="melmaga" />はい</label> <label><input type="radio" name="melmaga" />いいえ</label> </p> </fieldset> </fieldset> </form>
legend
Fieldset要素でグループ化したグループのタイトル
2008/3/26
構文
<legend> ~ </legend>
説明
legend属性は、fieldset要素でグループ化したグループのタイトルを指定します。
属性
属性="値" | 説明 | サポート状況 | 必須・任意 | 代替 | |
---|---|---|---|---|---|
XHTML 1.0 | XHTML 1.1 | ||||
一般属性 | - | STF | S | 任意 | style属性はCSSで代替。 |
accesskey="%Character" | アクセスキーを指定 | STF | S | 任意 | style属性はCSSで代替。 |
align="%LAlign" | 上下左右方向の整列位置を指定。上揃え場合は"top"、下揃えの場合は"bottom"、左揃えの場合は"left"、右揃えの場合は"right"を指定。 | TF | - | 任意 | CSS(floatプロパティ、vertica-alignプロパティ)で代替。 |
サンプル
<form action="#"> <fieldset> <legend>ログイン情報</legend> <p>ユーザー名:<input type="text" name="login_id" /></p> <p>パスワード:<input type="password" name="login_pw" /></p> </fieldset> </form>