HTML - <input> Tag


Advertisements


Description

The HTML <input>tag is used within a form to declare an input element − a control that allows the user to input data.

Example

<!DOCTYPE html>
<html>

   <head>
      <title>HTML input Tag</title>
   </head>
	
   <body>
      <form action = "/cgi-bin/hello_get.cgi" method = "get">
         First name: 
            <input type = "text" name = "first_name" value = "" maxlength = "100" />
            <br />
            
         Last name: 
            <input type = "text" name = "last_name" value = "" maxlength = "100" />
         <input type = "submit" value = "Submit" />
      </form>
   </body>
	
</html>

This will produce the following result −

Global Attributes

This tag supports all the global attributes described in − HTML Attribute Reference

Specific Attributes

The HTML <input> tag also supports the following additional attributes −

Attribute Value Description
accept content types Specifies a comma-separated list of content types that the server accepts.
align left
right
top
middle
bottom
Deprecated − Defines the alignment of content
alt text This specifies text to be used in case the browser/user agent can't render the input control.
autocomplete html-5 on
off
Specifies for enabling or disabling of autocomplete in <input> element
autofocus html-5 autofocus pecifies that <input> element should automatically get focus when the page loads
checked checked If type = "radio" or type = "checkbox" it will already be selected when the page loads.
disabled disabled Disables the input control. The button won't accept changes from the user. It also cannot receive focus and will be skipped when tabbing.
formhtml-5 form_id Specifies one or more forms
formaction html-5 URL Specifies the URL of the file that will process the input control when the form is submitted
formenctypehtml-5

application/x-www-form-urlencoded

multipart/form-data

text/plain

Specifies how the form-data should be encoded when submitting it to the serve
formmethod html-5 post
get
Defines the HTTP method for sending data to the action URL
formnovalidate html-5 formnovalidate Defines that form elements should not be validated when submitted
formtarget html-5 _blank
_self
_parent
_top
Specifies the target where the response will be display that is received after submitting the form
height html-5 pixels Specifies the height
list html-5 datalist_id Specifies the <datalist> element that contains pre-defined options for an <input> element
max html-5 autofocus Specifies the maximum value.
maxlength number Defines the maximum number of characters allowed in a text field
min html-5 number Specifies the minimum value.
multiple html-5 multiple Specifies that a user can enter multiple values
name text Assigns a name to the input control.
pattern html-5 regexp Specifies a regular expression that an <input> element's value is checked against
placeholder html-5 text Specifies a short hint that describes the expected value.
readonly readonly Sets the input control to read-only. It won't allow the user to change the value. The control however, can receive focus and are included when tabbing through the form controls.
required html-5 required Specifies that an input field must be filled out before submitting the form
size number Specifies the width of the control. If type = "text" or type = "password" this refers to the width in characters. Otherwise it's in pixels.
src URL Defines the URL of the image to display. Used only for type = "image".
step html-5 number Specifies the legal number intervals for an input field
type button
checkboxcolor
date
datetime
datetime-local
email
file
hidden
image
month
number
password
radio
range
reset
search
submit
tel
text
time
url
week
Specifies the type of control.
value text Specifies the intial value for the control.If type = "checkbox" or type = "radio" this attribute is required.
width html-5 pixels Specifies the width

Event Attributes

This tag supports all the event attributes described in HTML Events Reference

Browser Support

Chrome Firefox IE Opera Safari Android
Yes Yes Yes Yes Yes Yes

html_tags_reference.htm

Advertisements