There are various types of input fields that can be used in web forms to gather user information. Here are some commonly used input types along with examples:
- Text Input: Allows users to enter a single line of text. Example:
<input type="text" name="username" placeholder="Enter your username"> - Password Input: Conceals the entered text (usually used for passwords). Example:
<input type="password" name="password" placeholder="Enter your password"> - Email Input: Validates that the entered text is in the format of an email address. Example:
<input type="email" name="email" placeholder="Enter your email address"> - Number Input: Accepts numerical values. Example:
<input type="number" name="quantity" min="1" max="100" placeholder="Enter a number between 1 and 100"> - Checkbox: Allows users to select multiple options from a list. Example:
<label for="option1"> <input type="checkbox" id="option1" name="options" value="option1"> Option 1 </label> <label for="option2"> <input type="checkbox" id="option2" name="options" value="option2"> Option 2 </label>
6. Radio Buttons: Allows users to select a single option from a list. Example:
<label for="option1"> <input type="radio" id="option1" name="options" value="option1"> Option 1 </label> <label for="option2"> <input type="radio" id="option2" name="options" value="option2"> Option 2 </label>
7. Dropdown Select: Presents a list of options in a dropdown menu. Example:
<select name="country"> <option value="usa">USA</option> <option value="canada">Canada</option> <option value="uk">UK</option> </select>
8. File Upload: Allows users to select and upload files from their device. Example: <input type="file" name="file">
9. Date Input: Enables users to select a date from a calendar picker. Example: <input type="date" name="date">
These are just a few examples of input types available in HTML forms. Each input type serves a specific purpose and helps in collecting different types of user input.
