html
  1. html-input-tag

HTML <input> Tag

  • The HTML <input> tag is used to create an input field in a form where users can enter data.
  • The type of input field can be specified using the type attribute.

Syntax

<input type="[text|password|submit|reset|radio|checkbox|button|email|tel|url|number|date|color|search|range|file]" name="input_name" value="default_value">
  • type: Specifies the type of input field.
  • name: Specifies the name of the input field.
  • value: Specifies the default value displayed in the input field.

Example

Let's say we want to create a form where users can enter their name and choose their favorite color:

<form>
  Enter your Name:
  <br>
  <input type="text" name="name">
  <br>
  Choose your favorite color:
  <br>
  <input type="radio" name="color" value="red">Red
  <input type="radio" name="color" value="blue">Blue
  <input type="radio" name="color" value="green">Green
  <br>
  <input type="submit" value="Submit">
</form>
Try Playground

The above code will generate a form with an input field for the user's name and three radio buttons for the user to choose their favorite color. When the user clicks the Submit button, the form data is sent to the server for processing.

Explanation

The <input> tag is a self-closing tag. It can be used with several attributes to provide different types of input fields to the user.

  • type="text" creates a text input field.
  • type="password" creates a password input field.
  • type="submit" creates a submit button.
  • type="reset" resets the input fields in the form.
  • type="radio" creates a radio button.
  • type="checkbox" creates a checkbox.
  • type="button" creates a button that can be used to trigger an action.
  • type="email" creates an input field for email addresses.
  • type="tel" creates an input field for telephone numbers.
  • type="url" creates an input field for URLs.
  • type="number" creates an input field for numbers.
  • type="date" creates an input field for dates.
  • type="color" creates an input field for colors.
  • type="search" creates an input field for search queries.
  • type="range" creates an input field for a range of values.
  • type="file" creates a file upload field.

The name attribute is used to identify the field when the form data is sent to the server. The value attribute is used to set a default value for the input field.

Use

The <input> tag is an essential part of HTML forms. It allows users to input data that can be sent to the server for processing. The type of input can be customized using the type attribute.

Important Points

  • The type attribute determines the type of input field to be created.
  • The name attribute is used to identify the input field when the form data is sent to the server.
  • The value attribute sets a default value for the input field.

Summary

In summary, the HTML <input> tag creates an input field where users can input data. It is an important part of HTML forms and can be customized using various attributes like type, name, and value. The type of input field created depends on the type attribute.

Published on: