Written by: Geoffrey Callaghan

Form Tag in HTML

Form Tag In Html

The <form> tag in HTML is used to create an interactive form on a web page. It allows users to input data, which can then be submitted to a server for processing. Here’s an overview of how to use the <form> tag and its attributes:

Basic Structure

<form action="/submit-route" method="post">
  <!-- Form elements go here -->
  • The action attribute specifies the URL where the form data will be sent upon submission.
  • The method attribute specifies the HTTP method to be used when submitting the form. Common values are get and post.

Form Elements

Within the <form> tag, you can include various form elements such as text fields, checkboxes, radio buttons, select dropdowns, and more.

Text Input

<label for="username">Username:</label>
<input type="text" id="username" name="username">

Password Input

<label for="password">Password:</label>
<input type="password" id="password" name="password">


<label for="subscribe">Subscribe to newsletter:</label>
<input type="checkbox" id="subscribe" name="subscribe">

Radio Buttons

<input type="radio" id="male" name="gender" value="male">
<label for="male">Male</label>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label>

Select Dropdown

<label for="country">Country:</label>
<select id="country" name="country">
  <option value="usa">United States</option>
  <option value="canada">Canada</option>
  <option value="uk">United Kingdom</option>


<label for="message">Message:</label>
<textarea id="message" name="message"></textarea>

Submit Button

<button type="submit">Submit</button>

Form Submission

When the form is submitted, the browser sends the data to the URL specified in the action attribute using the HTTP method specified in the method attribute.

  • For GET requests, the form data is appended to the URL as query parameters.
  • For POST requests, the form data is sent in the body of the HTTP request.


<!DOCTYPE html>
<html lang="en">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Example Form</title>
  <h1>Contact Us</h1>
  <form action="/submit-form" method="post">
    <label for="name">Name:</label>
    <input type="text" id="name" name="name"><br>

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

    <label for="message">Message:</label>
    <textarea id="message" name="message"></textarea><br>

    <button type="submit">Submit</button>


The <form> tag in HTML provides a structured way to collect user input on web pages. By using various form elements within the <form> tag and specifying the action and method attributes, you can create interactive forms that allow users to submit data to a server for further processing.