Web4College

HTML input tag

HTML <input> tag allows the user to enter data in the form. It represents radio button, checkbox, input field and many other types of buttons depending upon the type of button. This element is used in the form element.

Example
Try it
<form action="files/inputtag.php" method="post">
 Name:<input type="text" name="fname" />
 Email:<input type="email" name="email" />
 <input type="submit" name="submit">
</form>
Name: Email:

Tag Uses

Specific uses of <input> tag

input element is basically used in a form to collect the information of a person.

Tag omission

It is self-closing tag i.e. there is no end tag.

Global Attributes

All the global attributes are applicable on the input element.

Tag Attributes

Attributes that are applicable to <input> tag
accept

accept attribute gives hint to the browser that which type of file will be accepted by the browser.

Example
Try it
<input type="file" accept="image/*">
autocomplete

This attribute suggests the input field values to fill automatically to facilitate the user.

Example
Try it
<input type="text" autocomplete>
autofocus

HTML autofocus attribute automatically focus the cursor or input control to the specific input field after page is loaded.

Example
Try it
<input type="file" autofocus>
checked

Checked attribute decides that which option should be checked by default in an option list.

Example
Try it
<input type="checkbox" checked>
disabled

This attribute disables the elements and prevents the clicks and user input from filling the form.

Example
Try it
<input type="text" name="ufile" disabled>
form

This attribute associates input control element to the form.

Example
Try it
<input type="text" form="id of the form element">
formaction

The address of form submission.

Example
Try it
<input type="text" formaction="The address of file to process data">
formenctype

The enchoding type to be used for form submition.

Example
Try it
<input type="text" formenctype="text/html">
formtarget

It represents the browsing mode for form submission.

Example
Try it
<input type="text" formtarget="browsing context mode">
list

This attribute associates input element to the datalist. Here datalist contains the predefined options for the user to select only one.

Example
Try it
<input type="text" list="name of the datalist tag">
max

This attribute gives the maximum value in input field.

Example
Try it
<input type="number" max="numerical value">
maxlength

This attribute restricts the value in the input field to the specific maximum length.

Example
Try it
<input type="number" maxlength="an integral value">
min

This attribute gives the maximum value in input field.

Example
Try it
<input type="number" min="numerical value">
minlength

This attribute restricts the value in the input field to the minimum length.

Example
Try it
<input type="text" minlength="an integral value">
multiple

Input control allows more than one options to save.

name

This attribute specifies a unique name for the html element. It is used to process the data.

Example
Try it
<input type="text" name="fullname">
pattern

The pattern to matched by the user input.

Example
Try it
<input type="password" patter="[A-Z][0-9]">
placeholder

This attribute hints the user about data entry in the input field or textarea.

Example
Try it
<input type="password" placeholder="password">
readonly

The presence of this attribute makes the text uneditable.

Example
Try it
<input type="text" readonly>
required

This attributes forces the user to enter value in the input field.

Example
Try it
<input type="email" required>
size

It defines the size of input control i.e. the number of options shown to user.

Example
Try it
<input type="text" size="40">
step

It increments or decrements same quantity in an input control.

Example
Try it
<input type="number" step="10">
type

It represents the type of input control.

Example
Try it
<input type="radio" name="gender" value="male">
value

It represents the initial content in an input control.

Example
Try it
<input type="radio" name="gender" value="male">