| カラーコード / サイトについて / リンク集 / お問い合わせ |
|
|
|
→ フォームの表示
→ ボタンを作る
→ メニューを作る
|
フォームの表示
ここではフォームの作り方を説明します。フォームはホームページを作るときはあまり使用しませんが、cgi（掲示板やチャット）を作るときによく使われます。どうやって作るか、覚えておけば後で役に立つかもしれません。
↓はフォームの説明です。action属性 には、実行するスクリプトなどを書きます。
<form action="処理するURL" name="フォームの名前"
method="送信形式"></form> 送信形式は、 GET か POST のどちらかを指定します。GETはURLの後ろに ? を付けてデータを送信する形式で、POSTは一度に多くのデータを送信するときに使います。これらはcgiを作るときによく使います。
ボタンを作る
input要素の type属性 をbuttonに指定するとボタンを作ることができます。 value属性 には、ボタンのラベルを指定します。ちなみにinput要素には終了タグが必要ありません。
<input type="button" value="ボタンです">
-表示結果-
テキストエリアの指定
textarea要素で複数行のテキストエリアを作ることができます。 rows属性 で高さを、 cols属性 で横の幅を指定することができます。これらの属性値は半角数字で指定します。
<textarea rows="4" cols="30">テキストエリアを作りました</textarea>
-表示結果-
テキストエリアの指定（１行）
input要素の type属性 をtextに指定すると、１行だけのテキストエリアを作ることができます。 size属性 でテキストエリアの幅を指定することができます。属性値は半角数字で指定します。
<input type="text" size="50" value="1行だけのテキストエリアです">
-表示結果-
パスワードを入力可能にする
input要素の type属性 をpasswordに指定すると、テキストエリアにパスワードを入力できるようになります。 size属性 でテキストエリアの幅を指定することができます。属性値は半角数字で指定します。
<input type="password" size="50">
-表示結果-
メニューを作る
select要素で囲まれた部分は、その部分がメニューであることを表します。その中にoption要素を複数置くことによってメニューを作ることができます。下のように使います。
<select>
<option>めにゅー１</option> <option>めにゅー２</option> <option>めにゅー３</option> <option>めにゅー４</option> <option>めにゅー５</option> </select> -表示結果-
チェックボックス＆ラジオボタン
input要素の type属性 をcheckboxに指定すると、チェックボックスを作ることができます。label要素で各項目の表示する名前を指定します。
好きな食べ物は？<br>
<input type="checkbox"><label>リンゴ</label> <input type="checkbox"><label>バナナ</label> <input type="checkbox"><label>ブドウ</label> <input type="checkbox"><label>メロン</label> <input type="checkbox"><label>スイカ</label> -表示結果-
好きな食べ物は？
input要素の type属性 をradioに指定するとラジオボタンを作ることができます。これもlabel要素で名前を表示しておきます。
あなたの年齢は？<br>
<input type="radio"><label>１０代</label> <input type="radio"><label>２０代</label> <input type="radio"><label>３０代</label> <input type="radio"><label>４０代</label> <input type="radio"><label>５０代〜</label> -表示結果-
あなたの年齢は？
|
 |