Paramwebinfo Academy | Website & Digital Marketing Training

Tutorials Details

Build Your Own Contact Form with HTML

October 18, 2024

Code:

<!DOCTYPE html>
<html>
<head>
<title>Contact Form</title>
</head>
<body>
<h1>Contact Us</h1>
<form>
<label for="name">Name:</label><br>
<input type="text" id="name" name="name" required><br><br>

<label for="email">Email:</label><br>
<input type="email" id="email" name="email" required><br><br>

<label for="message">Message:</label><br>
<textarea id="message" name="message" rows="4" cols="50" required></textarea><br><br>

<input type="submit" value="Submit">
<input type="reset" value="Reset">
</form>
</body>
</html>

Explanation:

<form>: This is an HTML form where users can enter their details.
Input Fields:
- Name Field (<input type="text">): A text field where the user can enter their name.
- Email Field (<input type="email">): An email input field which requires a valid email address.
- Message Field (<textarea>): A larger text area where users can type a message.
Submit Button:
- <input type="submit">: A button that, when clicked, submits the form
Reset Button (<input type="reset">): The Reset button clears all the input fields in the form, bringing them back to their default state.