Creating Sample Contact Us Form Using HTML
CONTACT FORM
PROGRAM :CODE
CONTACT FROM
what is the contact form?
A page on a website that allows users to communicate with the site owner. The page has fields for filling in name, address and type of comment. On most blogger websites, email and mailing addresses are also included; however, the contact form provides an immediate, convenient way for users to ask the blogger website questions.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="
width=device-width, initial-scale=1">
<link href ="https ://fonts.googleapis.com
/css?family =Raleway " rel= " stylesheet ">
<style>
body{
font-family: Calibri, Helvetica, sans-serf;
}
.container {
padding: 50px;
background-color : skyblue ;
}
input[type=text], input[type=password],textarea {
width: 100%;
padding: 15px;
margin: 5px 0 22px 0;
display: inline-block;
border: none;
background: #f1f1f1;
}
input[type=text]:focus,input[type=password]
:focus {
background-color: orange;
outline: none;
}
div {
padding: 10px 0;
}
hr {
border: 1px solid #f1f1f1;
margin-bottom: 25px;
}
.registerbtn {
background-color: #4CAF50;
color: white;
padding: 16px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
opacity: 0.9;
}
.registerbtn:hover {
opacity: 1;
}
</style>
</head>
<body>
<form>
</br>
</br>
<!--<marquee bgcolor ="Red" >
Registertion Now </Marquee >-->
</br>
</br>
<div class="container">
<center> <h1> Contact Us </h1> </center>
<hr>
<label> Firstname </label>
<input type="text" name="firstname"
placeholder= "Firstname" size="15" required />
<label> Middlename: </label>
<input type="text" name="product name "
placeholder="Middlename" size="15" required />
<label> Lastname: </label>
<input type="text" name="lastname"
placeholder="Lastname" size="15"required />
<div>
<label>
<div>
<label>
Gender :
</label><br>
<input type="radio" value="Male"
name="gender" checked > Male
<input type="radio" value="Female"
name="gender"> Female
<input type="radio" value="Other"
name="gender"> Other
</div>
<label>
Phone :
</label>
<input type="text" name"phone"
placeholder="" value="+91" size="2"/>
<input type="text" name="phone" placeholder="
retype phone no." size="10"/ required>
</br>
State :
<input type ="text " name = "state "
placeholder = "state ">
</br>
</br>
<label for="email"><b>Email</b></label>
<input type="text" placeholder="Enter Email"
name="email" required>
<label for="psw"><b>Password</b></label>
<input type="password" placeholder=
"Enter Password" name="psw" required>
<label for="psw-repeat"><b>Re-type
Password</b></label>
<input type="password" placeholder=
"Retype Password" name="psw-repeat" required>
<button type="submit" class="registerbtn">
Submit </button>
</form>
</body>
</html>
No comments:
Post a Comment