HTML5 – Input types and attributes
The <input>
element is used to create form controls such as text fields, checkboxes, and buttons. In HTML5, the <input>
element has a type
attribute that specifies the type of control to display.
Here is a list of some common input types in HTML5:
text
: a single-line text fieldpassword
: a single-line text field with obscured charactersradio
: a radio buttoncheckbox
: a checkboxsubmit
: a submit buttonreset
: a reset button
Here is an example of how to create a form with different input types in HTML5:
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name"><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password"><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>
<input type="checkbox" id="newsletter" name="newsletter" value="yes">
<label for="newsletter">Sign up for newsletter</label><br>
<input type="submit" value="Submit">
</form>
In this example, the form includes a text field for the name, a password field for the password, two radio buttons for the gender, a checkbox for signing up for a newsletter, and a submit button to submit the form.
The name
attribute is used to identify the form control when the form is submitted. The value
attribute specifies the default value of the form control. The id
attribute is used to uniquely identify the form control, and is used in conjunction with the for
attribute of the <label>
element to associate the label with the <input>
.