formの授業 記述

<DOCTYPE html>
<html lang="ja">
<head>
<mata charset="UTF-8">
<title>お問い合せフォーム 練習</title>
</head>
<body>
<form action="#" method="post" enctype="multipart/form-data">
<p>お問い合わせはこちらのフォームからお願いします。</p>
<p>お名前:
<input type="text" name="name" size="20" maxlength="10" value="お名前	"></p>
<p>内容:
<textarea name="subject" rows="5" cols="40">お問い合わせ内容 </textarea></p>
<!-- チェックボックス  -->
<p>スマートフォン:
<input type="checkbox" name="mobile" value="1" checked> iphone
<input type="checkbox" name="mobile" value= "2" > android
<input type="checkbox" name="mobile" value= "3">その他
</p>
<!-- ラジオボタン -->
<p>性別:
<input type="radio" name="sex" value="male" checked>男性
<input type="radio" name="sex" value="female">女性
</p>
 <!--リスト -->   
<p>言語:
<select name="language">
<option value="ja">日本</option>
<option value="en">英語</option>
<option value="de">ドイツ</option>
<option value="fr">フランス</option>
<option value="ko"> 韓国</option>
<option value="zh">中国</option>
</select>
</p>
<!-- パスワード  -->
<p>パスワード:
<input type="password" name="password" size-"10" maxlength="5"></p>
<p><input  type="submit" value="送信"></p>
<!-- 写真をアップロード -->
<p>
<input type="file" name="picture">
</p>
<p>
<input type="submit" value="送信"><input type="submit" value="リセット">
</p>
</form>
</body>
</html>

まとめ

  • action="データの送信先URLを入れる"
  • method="post" フォームのデータのみを本文として送信
  • mane属性は必須
  • enctype="multipart/form-data" ファイルを添付する様なフォーム