how to create feedback form in html
how to create feedback form in html
1 Answer
The feedback form is an essential part of websites. especially for the company which need feedback from the customers about their products.
you have to start with the <form>
tag, Then add some inputs with <input>
tag and label them with <label>
tag. so let the user enter his name, e-mail and the message he wants to send. and a small button to clear the form to make it more useability.
Example:
<form action="" method="POST">
<label for="fullName">Your Name</label> <br>
<input type="text" name="fullName"><br><br>
<label for="gender">Your Gender</label> <br>
<input type="radio" name="gender" value="male">Male<br>
<input type="radio" name="gender" value="female">Female<br><br>
<label for="email">Your E-mail</label> <br>
<input type="text" name="email"><br>
<br>
<label for="comments">Your Comments</label> <br>
<textarea name="comments"></textarea><br><br>
<input type="submit" value="Submit">
<input type="reset" value="Clear">
</form>
Output:
Ok, that's nice but still, need some touches with CSS, change the margin, padding and some colors.
Example:
form {
width: 400px;
background-color: lightblue;
text-align: center;
padding: 20px;
}
input, textarea {
padding: 12px;
margin: 6px 6px 6px 0;
}
Output:
What about the button? do some magic on them!
Example:
input[type=submit] {
background-color: green;
color: white;
padding: 12px 20px;
border: none;
cursor: pointer;
}
input[type=reset] {
background-color: red;
color: white;
padding: 12px 20px;
border: none;
cursor: pointer;
}
input[type=submit]:hover {
background-color: darkgreen;
color: lightblue;
}
input[type=reset]:hover {
background-color: white;
color: blue;
}
Output:
And that's it.
answer Link