The HTML <input> type attribute defines the type of input field displayed in a form. It controls how users enter data and how the browser processes the input.
- Specifies the kind of input field and is used inside the <input> tag.
- Helps in data validation and improves user experience in forms.
- Supports different input types such as text, email, number, and date.
Syntax:
<input type="value">Attribute Values
- button : button defines a clickable button in an HTML document.
- checkbox : checkbox is used for selecting one or more limited options.
- color : Defines a color picker input field.
- date : date is used for selecting dates with year, month, and day.
- email : Defines a field for entering email addresses with automatic validation.
- file : Allows users to select and upload files.
- hidden : hidden conceals data from users for backend operations.
- image : Defines an image as a submit button.
- month : Specifies a month and year control field.
- number : number defines a field for entering numeric values.
- password : password Used for sensitive data entry with hidden characters.
- radio : radio allows single selection from predefined options.
- range : range defines a slider control for selecting numeric ranges.
- reset : reset resets all form values to their initial state.
- search : Defines a text field for search queries.
- submit : submit submits form data to the server.
- tel : tel defines a field for entering telephone numbers.
- text : Defines a single-line text input field.
- time : Specifies a control for entering time values.
- url : url defines a field for entering and validating URLs.
- week : Defines a week and year control field.
Example: We have HTML form for username and password input with submit and reset buttons. Input type attributes: "text" for username, "password" for password.
<!DOCTYPE html>
<html>
<body>
<h3>HTML input type Attribute</h3>
<form action="#" method="get">
Username: <input type="text" name="uname">
<br><br>
Password: <input type="password" name="pwd">
<br><br>
<button type="submit" value="submit">
Submit
</button>
<button type="reset" value="reset">
Reset
</button>
</form>
</body>
</html>