HTML/Elements/input

From Web Education Community Group
< HTML‎ | Elements
Jump to: navigation, search

<input>

The <input> element represents a typed data field, usually with a form control to allow the user to edit the data.

Point

  • The type attribute controls the data type (and associated control) of the element. It is an enumerated attribute.


  • The following table lists the keywords and states for the attribute.
    The keywords in the left column map to the states in the cell in the second column on the same row as the keyword.


Keyword State Data type Control type
hidden Hidden An arbitrary string n/a
text Text Text with no line breaks Text field
search Search Text with no line breaks Search field
tel Telephone Text with no line breaks A text field
url URL An absolute IRI A text field
email E-mail An e-mail address or list of e-mail addresses A text field
password Password Text with no line breaks (sensitive information) Text field that obscures data entry
datetime Date and Time A date and time (year, month, day, hour, minute, second, fraction of a second) with the time zone set to UTC A date and time control
date Date A date (year, month, day) with no time zone A date control
month Month A date consisting of a year and a month with no time zone A month control
week Week A date consisting of a week-year number and a week number with no time zone A week control
time Time A time (hour, minute, seconds, fractional seconds) with no time zone A time control
datetime-local Local Date and Time A date and time (year, month, day, hour, minute, second, fraction of a second) with no time zone A date and time control
number Number A numerical value A text field or spinner control
range Range A numerical value, with the extra semantic that the exact value is not important A slider control or similar
color Color An sRGB color with 8-bit red, green, and blue components A color well
checkbox Checkbox A set of zero or more values from a predefined list A checkbox
radio Radio Button An enumerated value A radio button
file File Upload Zero or more files each with a MIME type and optionally a file name A label and a button
submit Submit Button An enumerated value, with the extra semantic that it must be the last value selected and initiates form submission A button
image Image Button A coordinate, relative to a particular image's size, with the extra semantic that it must be the last value selected and initiates form submission Either a clickable image, or a button
reset Reset Button n/a A button
button Button n/a A button


HTML Attributes

  • Which of the attributes apply to an input element depends on the state of its type attribute. The following table is summarizes which of those content attributes.


Hidden Text, Search, URL, Telephone E-mail Password Date and Time, Date, Month, Week, Time Local Date and Time, Number Range Color Checkbox, Radio Button File Upload Submit Button Image Button Reset Button, Button
Content attributes
accept · · · · · · · · · Yes · · ·
alt · · · · · · · · · · · Yes ·
autocomplete · Yes Yes Yes Yes Yes Yes Yes · · · · ·
checked · · · · · · · · Yes · · · ·
formaction · · · · · · · · · · Yes Yes ·
formenctype · · · · · · · · · · Yes Yes ·
formmethod · · · · · · · · · · Yes Yes ·
formnovalidate · · · · · · · · · · Yes Yes ·
formtarget · · · · · · · · · · Yes Yes ·
height · · · · · · · · · · · Yes ·
list · Yes Yes · Yes Yes Yes Yes · · · · ·
max · · · · Yes Yes Yes · · · · · ·
maxlength · Yes Yes Yes · · · · · · · · ·
min · · · · Yes Yes Yes · · · · · ·
multiple · · Yes · · · · · · Yes · · ·
pattern · Yes Yes Yes · · · · · · · · ·
placeholder · Yes Yes Yes · · · · · · · · ·
readonly · Yes Yes Yes Yes Yes · · · · · · ·
required · Yes Yes Yes Yes Yes · · Yes Yes · · ·
size · Yes Yes Yes · · · · · · · · ·
src · · · · · · · · · · · Yes ·
step · · · · Yes Yes Yes · · · · · ·
width · · · · · · · · · · · Yes ·


See also global attributes.


HTML Reference

The HTML5 specification defines the <input> element in 4.10.7 The input element.