誰でも見たことのある、「お問い合わせフォーム」
<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>フォームの練習</title>
</head>
<body>
<form method="post" action="#">
<p>名前:<input type="text" name="name" size="30" maxlength="10"></p>
<p>メールアドレス:<input type="text" name="email"
size="30"></p>
<p>好きな色:
<label><input type="radio" name="color" value="red">赤</label>
<label><input type="radio" name="color" value="blue">青</label>
<label><input type="radio" name="color" value="green">緑</label>
</p>
<p>趣味:
<label><input type="checkbox" name="hobby" value="1">音楽</label>
<label><input type="checkbox" name="hobby" value="2">スポーツ</label>
<label><input type="checkbox" name="hobby" value="3">旅行</label><label><input type="checkbox" name="hobby" value="4">料理</label><label><input type="checkbox" name="hobby" value="5" checked>読書</label>
</p>
<p>
<select name="district">
<option value="">以下の地域から選択してください</option>
<option value="hokkaodo">北海道</option>
<option value="tohoku">東北</option>
<option value="kanto">関東</option>
<option value="tokai">東海</option>
<option value="kinki">近畿</option>
<option value="chugoku">中国</option>
<option value="shikoku">中国</option>
<option value="kyushu">九州</option>
<option value="okinawa">沖縄</option>
</select>
</p>
<p>メモ:<textarea name="memo" rows="5" cols="40"></textarea></p>
<p><input type="submit" value="送信"></p>
</form>
</body>
</html>
size="30":
半角で30文字ということ。全角では15文字。
maxlength="10":
全角で10文字まで打てますということ。(いたずら防止でもある)
label:
選択フォームを作る際は必ずつけること。
input type="radio":
選択する際、どれか一つしかチェックできません。(※性別の選択等で使用)
input type="checkbox":
選択する際、何個でもチェックできます。(↑上の逆のパターン)
select name="district":
選択するものが閉まわれています。(選択種類が沢山あるときにはこれを使用)
input type="submit":
入力されたデーターを送信します。(⇔<botton>送信</botton>データの送信をしないときはこちらを使用)