how to create feedback form in html

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:

Your Name


Your Gender
Male
Female

Your E-mail


Your Comments

 

 

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