using HTML for create a website registration form to obtain users First name, last name, date of birth, phone number, and email address*([email protected]) *With a background for the web page
HTML CODE:- (index.html)
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<form>
<div class="container">
<center> <h1>Registeration Form</h1>
</center>
<hr>
<label> First Name </label>
<input type="text" name="firstname" placeholder= "First name"
size="15" required />
<label> Last Name: </label>
<input type="text" name="Last name" placeholder="Last name"
size="15" required />
<label> Date of Birth: </label>
<input type="date" name="DOB" placeholder="DOB"
size="15"required />
<div>
<label>
Phone:
</label>
<input type="text" name="phone" placeholder="Phone no."
size="10"/ required>
<label for="email">Email:</label>
<input type="text" placeholder="Enter Email" name="email"
required>
<button type="submit"
class="submitbtn">Submit</button>
</div>
</div>
</form>
</body>
</html>
CSS Code :- (style.css)
body{
padding: 0%;
margin: 0%;
}
.container {
padding: 50px;
background-color: thistle;
}
input[type=text],input[type=date]{
width: 100%;
padding: 15px;
margin: 5px 0 22px 0;
display: inline-block;
border: none;
}
div {
padding: 10px 0;
}
hr {
border: 1px solid #f1f1f1;
margin-bottom: 25px;
}
.submitbtn {
background-color: #4CAF50;
color: white;
padding: 16px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
opacity: 0.9;
}
.submitbtn:hover {
opacity: 1;
}
Get Answers For Free
Most questions answered within 1 hours.