The HTML tag <input> is one of the most commonly used tags in web development. It is used to create various types of form elements such as text boxes, radio buttons, checkboxes, and more. The <input> tag is an empty tag, which means it does not have a closing tag. Instead, it uses attributes to define its behavior and appearance.
The <input> tag is used to create form elements that allow users to input data. The type of input element created depends on the value of the type attribute. Some of the most commonly used types of input elements are:
text: Creates a single-line text box for users to input text.password: Creates a single-line text box for users to input passwords. The text entered is masked with asterisks or dots.checkbox: Creates a checkbox that users can select or deselect.radio: Creates a radio button that users can select from a group of options.submit: Creates a button that users can click to submit the form.reset: Creates a button that users can click to reset the form to its initial state.The <input> tag can also have other attributes such as name, value, placeholder, required, and more. These attributes are used to define the behavior and appearance of the input element.
To create a text input element, use the <input> tag with the type attribute set to text:
<input type="text" name="username" placeholder="Enter your username">
This will create a text box with a placeholder text that says "Enter your username".
To create a password input element, use the <input> tag with the type attribute set to password:
<input type="password" name="password" placeholder="Enter your password">
This will create a text box with a placeholder text that says "Enter your password". The text entered will be masked with asterisks or dots.
To create a checkbox input element, use the <input> tag with the type attribute set to checkbox:
<input type="checkbox" name="agree" value="yes"> I agree to the terms and conditions
This will create a checkbox with a label that says "I agree to the terms and conditions". If the checkbox is selected, the value "yes" will be submitted with the form.
To create a radio input element, use the <input> tag with the type attribute set to radio:
<input type="radio" name="gender" value="male"> Male
<input type="radio" name="gender" value="female"> Female
This will create two radio buttons with labels that say "Male" and "Female". Users can select only one option from the group.
To create a submit button, use the <input> tag with the type attribute set to submit:
<input type="submit" value="Submit">
This will create a button with the label "Submit". When clicked, the form will be submitted.
To create a reset button, use the <input> tag with the type attribute set to reset:
<input type="reset" value="Reset">
This will create a button with the label "Reset". When clicked, the form will be reset to its initial state.