HTML5 – Form elements and attributes
The <form>
element is used to create a form on a web page. Forms are used to collect input from users and to submit the input to a server for processing.
Here is an example of a basic form in HTML5:
<form action="/submit" method="post">
<label for="name">Name:</label><br>
<input type="text" id="name" name="name"><br>
<label for="email">Email:</label><br>
<input type="email" id="email" name="email"><br>
<label for="message">Message:</label><br>
<textarea id="message" name="message"></textarea><br>
<input type="checkbox" id="newsletter" name="newsletter" value="yes">
<label for="newsletter">Sign up for newsletter</label><br>
<input type="radio" id="male" name="gender" value="male">
<label for="male">Male</label><br>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label><br>
<label for="country">Country:</label><br>
<select id="country" name="country">
<option value="">Select a country</option>
<option value="US">United States</option>
<option value="UK">United Kingdom</option>
<option value="FR">France</option>
</select><br>
<input type="submit" value="Submit">
</form>
In this example, the form includes additional elements such as a checkbox, radio buttons, and a select menu. These elements can be used to collect more specific input from the user.
The value
attribute specifies the value of the form control when it is selected or checked. The <option>
element is used to create options in a select menu.
Forms can also include additional attributes such as placeholder
to provide a hint to the user, required
to make the field required, and pattern
to specify a regular expression to validate the input.
You can style forms and form elements using CSS, such as by changing the font, color, or layout. You can also apply CSS classes or IDs to forms and form elements to give them specific styles.