selectとoptionはセットで使用し、フォームやアンケートなどホームページの部品を作る際に使います。formタグと一緒に使いサーバーへデータを送信する際に使用します。selectはあらかじめ設定した項目の選択に使用します。optionはselectの選択肢の設定に使用します。下記掲載のHTML使用例を確認するれば理解が早いでしょう。
カテゴリ | タグ | 機能 | 属性 |
---|---|---|---|
フォーム | <select> | 選択リストを定義します。 | name sizeなど |
<option> | ドロップダウンリストなどを作ります。 | valueなど |
使用例 |
---|
<select name="名前" size="縦幅"><option></option></select> |
section optionの説明
optionとセットで使用します。ドロップダウン型のセレクトボックスを作ります。selectedを入れた場合は選択された状態で表示されます。
属性
name
selectの名前です。サーバーへのデータ転送時やJavaScriptによる走査などの際に利用します。
size
optionの表示がサイズの縦幅を変更できます。デフォルトで0が適用されています。指定方法はsize=”5″のように書きます。5つ分表示された状態になります。
multiple
複数の項目が選択可能になります。shiftキーやコマンドキーを押しながらクリックすることができるようになります。これを指定していない場合は1つしか選択できません。
form
form
HTML5で追加されました。いままではformの子要素としてformタグないに書く必要がありましたが、form属性を指定することで、formタグの外でも使えるようになりました。
selectとoptionの使用例
プレビュー
*基本形です。
*size=3を指定することで全ての項目が表示された状態になります。
*selectedを指定することで”グリーン”が選択された状態になります。
*multipleを指定することでキーボードの矢印キーで動かすことができます。
formについてのページのありますので、よくわからない方はご覧になってください。