RetroSearch Browse

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://www.geeksforgeeks.org/html/html-form-tag/ below:

HTML form Tag - GeeksforGeeks

HTML form Tag

Last Updated : 11 Jul, 2025

The <form> tag is used to create an HTML form for user input. It serves as a container for various input elements like text fields, checkboxes, and buttons, enabling the collection of data for submission to a server or processing via client-side scripts.

Note: The <form> tag supports the Global Attributes and Event Attributes in HTML.

index.html


 <html>
<body>
<form action="/submit" method="POST">
<h2>User Information</h2>
<label for="fname">
    First Name
            </label>
<input id="fname" name="fname" placeholder="Enter your first name" required="" type="text"/>
<br/>
<br/>
<label for="lname">
    Last Name
            </label>
<input id="lname" name="lname" placeholder="Enter your last name" required="" type="text"/>
<br/>
<br/>
<input type="submit" value="Submit"/>
</form>
</body>
</html>

Common Form Elements

Attributes

Attributes

Descriptions

name

It provides a name for the form.

target

It specifies where to display the response after form submission (like a new window or the current window).

Action Attribute

Sends form data to the server upon submission.

Enctype Attribute

application/x-www-form-urlencoded: Standard form data submission.
multipart/form-data: Used for file uploads like images, documents, etc.

Methods

Get Method: Limited URL character length, and used when we have to get data from somewhere like server.
Post Method: No size limits, submissions cannot be bookmarked and used when we sends data to server.

accept-charset

It specifies the character encodings that is to be used for the form submission

autocomplete

It specifies whether a form should have autocomplete on or off

novalidate

It specifies that the form should not be validated before submitting

rel

It specifies the relationship between a linked resource and the current document.

Form with Radio button

In this example we creates a form with radio buttons for gender selection. It's properly structured with opening and closing <form> tags, labels, and radio input elements within a centered layout.

index.html


 <html>
<body>
<h1>
   Gender Validation
        </h1>
<form action="#" method="post">
<label for="male">
    Male
            </label>
<input id="male" name="gender" type="radio" value="male"/>
<label for="female">
    Female
            </label>
<input id="female" name="gender" type="radio" value="female"/>
<label for="other">
    Other
            </label>
<input id="other" name="gender" type="radio" value="other"/>
<br/>
<br/>
<input type="button" value="Submit"/>
</form>
</body>
</html>

Form with Checkox

The form will display a list of checkboxes with labels. Users can select one or more options and click the Subscribe button to submit their choices.

index.html


 <html>
<body>
<h1>
   Newsletter Subscription
        </h1>
<form action="/submit" method="POST">
<p>Select your interests:</p>
<input id="tech" name="interests" type="checkbox" value="Technology"/>
<label for="tech">
    Technology
            </label>
<br/>
<input id="sports" name="interests" type="checkbox" value="Sports"/>
<label for="sports">
    Sports
            </label>
<br/>
<input id="music" name="interests" type="checkbox" value="Music"/>
<label for="music">
    Music
            </label>
<br/>
<input id="movies" name="interests" type="checkbox" value="Movies"/>
<label for="movies">
    Movies
            </label>
<br/>
<br/>
<input type="submit" value="Subscribe"/>
</form>
</body>
</html>

Now you have clear understanding of HTML <form> so you can implement this knowledge to create some interesting components using CSS and JavaScript –

Using CSS

Using JavaScript

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4