Home  »  HTML   »   input

Input is a tag that takes input from the user. There are many types of inputs that can be defined using the attributes of the input tag.


represents the name for the control submitted as a pair with its value.

  • text

represents type of the input element.

  • button - clickable button. Usually needs Javascript to activate
  • checkbox - check/tick box.
  • color - pickable color.
  • date - field to select date
  • datetime-local - date and time field (dd-mm-yyyy time)
  • email - email address field
  • file - browse button for file upload with select a file field.
  • hidden - hidden input field. Users cannot access this field but its value will be sent when a form is submitted.
  • image - image that acts as a submit button.
  • number - text field that allows only numeric values.
  • password - text field that displays asterisks when input added.
  • radio - radio button inputs
  • range - slider control to select numeric values to define range
  • reset - input control that acts as a reset button
  • search - text field that allows adding a search string
  • submit - submit button
  • tel - text field that allows only numeric values to add phone numbers
  • text - single-line text field. Default value.
  • time - field to select the time.
  • URL - text field that allows only absolute URL.

represents value of input element.

  • text

represents an element that is already selected when the page loads, when the input type is checkbox or radio.

  • none

represents the maximum number of characters allowed in the field.

  • number

represents the minimum number of characters allowed in the field.

  • number

represents the URL of an image that is used as a submit button when the input type is an image.

  • URL

represents a text which is displayed when the images cannot display if the input type is an image.

  • text¬†

represents which file is allowed to be attached with the form when the input type is the file.

  • audio - select audio file only.
  • video - select video file only.
  • image - select image file only.
  • media_type - MIME type file.
  • file_extension - select file with specific file extension such as .pdf, .doc, etc.

represents the input element is disabled.

  • none

represents the input element cannot be changed.

  • none

represents whether the input field should be filled automatically when a form is submitted.

  • on - browser automatically complete the values
  • off - the user has to fill the data by itself.

represents the input field that is automatically focused when the page loads.

  • none

represents the name of the field that is used for sending text direction when the form is submitted.

  • inputname.dir - ltr (left to right) / rtl (right to left)

represents a list of data for an input element.

  • datalist_id

represents maximum value for an input element.

  • number, date

represents minimum value for an input element.

  • number, date

represents the increment or decrement value in which the number should increase or decrease.

  • number

represents one or more data can be entered in input field. Usually used when input type is email or file.

  • none

represents regular expression for which the value of input element is checked against.

  • regexp

represents a visible text that describes what value to be entered in that input field.

  • text

represents that the data should be filled in input field compulsory.

  • none

represents the width as per characters of input field.

  • number

HTML input Example:

Edit Example