名前、性別、メールアドレスを登録するHTMLフォームのサンプルコード
以下は名前、性別、メールアドレスを登録するHTMLフォームのサンプルコードです。
<form>
<label for="name">名前:</label>
<input type="text" id="name" name="name"><br><br>
<label for="gender">性別:</label>
<input type="radio" id="male" name="gender" value="male">
<label for="male">男性</label>
<input type="radio" id="female" name="gender" value="female">
<label for="female">女性</label><br><br>
<label for="email">メールアドレス:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="送信">
</form>
このコードでは、<form>
要素でフォームを定義し、<label>
要素と<input>
要素を使用して名前、性別、メールアドレスの3つの入力フィールドを作成しています。性別にはラジオボタンを使用し、男性と女性の2つの選択肢を提供しています。最後に、<input>
要素を使用して送信ボタンを追加しています。
年齢を含めた場合
以下は名前、性別、年齢、メールアドレスを登録するHTMLフォームのサンプルコードです。
<form>
<label for="name">名前:</label>
<input type="text" id="name" name="name"><br><br>
<label for="gender">性別:</label>
<input type="radio" id="male" name="gender" value="male">
<label for="male">男性</label>
<input type="radio" id="female" name="gender" value="female">
<label for="female">女性</label><br><br>
<label for="age">年齢:</label>
<input type="number" id="age" name="age"><br><br>
<label for="email">メールアドレス:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="送信">
</form>
このコードでは、年齢を含めた入力フィールドを追加するために、<label>
要素と<input>
要素を使用して<form>
要素を更新しています。年齢の入力フィールドには、type="number"
属性を使用して数値フィールドを指定しています。