Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
6 views

HTML Forms

Uploaded by

Muthamil0593
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
6 views

HTML Forms

Uploaded by

Muthamil0593
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

HTML Forms

An HTML form is used to collect user input and send it to a server for processing.
It allows interaction with the user through various input elements such as text
fields, buttons, checkboxes, and dropdowns.

Common Form Elements


Element Description
<input> Used to create various input fields (text, password, etc.).
<textarea> Creates a multi-line text input.
<button> Defines a clickable button.
<select> and <option> Creates a dropdown list.
<label> Associates a label with a form element for accessibility.
<fieldset> Groups related elements in a form.
<legend> Adds a caption for a <fieldset>.

Attributes of <form>
Attribute Description
action Specifies the URL where the form data will be sent.
method Defines how the form data should be sent. Values: GET (default)
or POST.
enctype Specifies how the form data should be encoded. Common for file
uploads.
target Specifies where to display the response (_self, _blank, _parent,
_top).
autocomplete Enables or disables autofill for input fields (on, off).
novalidate Disables form validation before submission.

Ex:
<label for="name">Name:</label>
<input type="text" id="name" name="name" placeholder="Enter your name"
required>
<br><br>

<!DOCTYPE html>
<html>
<head>
<title>HTML Form Example</title>
</head>
<body>
<h1>Registration Form</h1>
<form action="/submit-form" method="POST">
<label for="name">Name:</label>
<input type="text" id="name" name="name" placeholder="Enter your name"
required>
<br><br>

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

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

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

<label for="hobbies">Hobbies:</label>
<input type="checkbox" id="sports" name="hobbies" value="Sports"> Sports
<input type="checkbox" id="reading" name="hobbies" value="Reading"> Reading
<br><br>

<label for="country">Country:</label>
<select id="country" name="country">
<option value="india">India</option>
<option value="usa">USA</option>
<option value="uk">UK</option>
</select>
<br><br>

<label for="message">Message:</label>
<textarea id="message" name="message" rows="5" cols="30" placeholder="Your
message"></textarea>
<br><br>

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

You might also like