w3resource
HTML exercises

HTML CSS Exercise: HTML Form

Solution:

HTML Code :

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset=utf-8>
<title>HTML CSS Form exercise</title>
</head>
<body>
<div class="container">
<h1>Travel reservation form</h1>
<h3>* denotes mandotory</h3>
<form id="registration_form" method="POST">
  <label>Full name*:</label><br>
  <input type="text" name="full_name" placeholder="FirstName LastName" autofocus="autofocus" value=""><br>   
  <label>Email address*:</label><br>
  <input type="text" name="email_addr" value=""><br>
  <label>Select Tour Package* :</label><br>	
   <select name="package">
	<option value="Goa" >Goa</options>
	<option value="Kashmir" >Kashmir</options>
	<option value="Rajasthan" >Rajasthan</options>
   </select><br>
  <label>Arrival date*:</label><br>
  <input type="text" name="arv_dt" placeholder="m/d/y" value=""><br>
        <label>Number of persons*:</label><br>
  <input type="text" name="persons" value=""s><br>
     <label>What would you want to avail?*</label> <br> 
 Boarding<input type="checkbox" name="facilities[]" value="boarding"  ><br>
 Fooding<input type="checkbox" name="facilities[]" value="fooding"  ><br>
 Sight seeing<input type="checkbox" name="facilities[]" value="sightseeing"  ><br>
   <label>Discount Coupon code:</label><br>
  <input type="text" name="dis_code" value=""><br>
      <label>Terms and conditions*</label><br>
  <input type="radio" name="tnc" value="agree" checked>I agree
  <input type="radio" name="tnc" value="disagree" >I disagree<br>
  <button type="submit" class="btn btn-large btn-primary" name="submit">Complete reservation</button>
</form>
</div>
</body>
</html>

Live Demo:

See the Pen form-answer by w3resource (@w3resource) on CodePen.


Supported browser

Firefox logo Chrome logo Opera logo Safari logo Internet Explorer logo
YesYesYesYesYes

What is the difficulty level of this exercise?



New Content: Composer: Dependency manager for PHP, R Programming