Shine Tutorial    
  shinetutorialtopsideimage
HOME DOS OS C,C++ HTML CSS XML JAVA ASP PHP SQL OFFICE MULTIMEDIA MORE... CERTIFICATION ABOUT
 
S T ADVT
TUTORIALS

HTML 5 Reference

HTML 5 Tags
HTML 5 Attributes
HTML 5 Events

HTML 5 Tags

<!-->
<!DOCTYPE>
<a>
<abbr>
<acronym>
<address>
<applet>
<area>
<article>
<aside>
<audio>
<b>
<base>
<basefont>
<bdo>
<big>
<blockquote>
<body>
<br>
<button>
<canvas>
<caption>
<center>
<cite>
<code>
<col>
<colgroup>
<command>
<datalist>
<dd>
<del>
<details>
<dfn>
<dir>
<div>
<dl>
<dt>
<em>
<embed>
<fieldset>
<figcaption>
<figure>
<font>
<footer>
<form>
<frame>
<frameset>
<h1> - <h6>
<head>
<header>
<hgroup>
<hr>
<html>
<i>
<iframe>
<img>
<input>
<ins>
<keygen>
<kbd>
<label>
<legend>
<li>
<link>
<map>
<mark>
<menu>
<meta>
<meter>
<nav>
<noframes>
<noscript>
<object>
<ol>
<optgroup>
<option>
<output>
<p>
<param>
<pre>
<progress>
<q>
<rp>
<rt>
<ruby>
<s>
<samp>
<script>
<section>
<select>
<small>
<source>
<span>
<strike>
<strong>
<style>
<sub>
<summary>
<sup>
<table>
<tbody>
<td>
<textarea>
<tfoot>
<th>
<thead>
<time>
<title>
<tr>
<tt>
<u>
<ul>
<var>
<video>
<xmp>


 

HTML 5 <input> Tag


Example

A simple HTML form with two input fields and one submit button:

<form action="form_action.asp" method="get">
First name: <input type="text" name="fname" /><br />
Last name: <input type="text" name="lname" /><br />
<input type="submit" value="Submit" />
</form>

View it »

Definition and Usage

The <input> tag defines the start of an input field where the user can enter data.


Differences Between HTML 4.01 and HTML 5

In HTML 4.01 the "align" attribute was deprecated, and is not supported in HTML 5, use CSS to align input elements.

HTML 5 has many new attributes.

In HTML 5 the type attribute has a lot of new values.


Tips and Notes

Note: The input element is empty, it contains attributes only.

Tip: Use the label element to define a label to a form control.


Attributes

New : New in HTML 5.

Attribute Value Description
accept list_of_mime_types A comma-separated list of MIME types that indicates the MIME type of the file transfer.

Note: Only used with type="file"

alt text Defines an alternate text for the image.

Note: Only used with type="image"

autocompleteNew on
off
If "on" browsers can store the form's input values, to auto-fill the form if the user returns to the page.
If "off" browsers should not store this information.
autofocusNew autofocus Makes the input field focused on page load

Note: Cannot be used with type="hidden"

checked checked Indicates that the input element should be checked when it first loads.

Note: Used with type="checkbox" and type="radio"

disabled disabled Disables the input element when it first loads so that the user can not write text in it, or select it.

Note: Cannot be used with type="hidden"

formNew formname Defines one ore more forms the input field belongs to.
formactionNew URL Overrides the form's action attribute. Must be a valid URL that defines where to send the data when the form is submitted.
formenctypeNew application/x-www-form-urlencoded
multipart/form-data
text/plain
Overrides the form's enctype attribute. Defines the mime type used to encode the content of the form.
formmethodNew get
post
put
delete
Overrides the form's method attribute. Defines the HTTP method for sending data to the action URL.
formnovalidateNew true
false
Overrides the form's novalidate attribute. If "true" the input field should not be validated when submitted.
formtargetNew _blank
_self
_parent
_top
Overrides the form's target attribute.
Where to open the target URL.
  • blank - the target URL will open in a new window
  • _self - the target URL will open in the same frame as it was clicked
  • _parent - the target URL will open in the parent frameset
  • _top - the target URL will open in the full body of the window
heightNew pixels
%
Defines the height of an input field.
listNew id of a datalist Reference to a datalist element. If defined, a suggestion list (drop down list?) should be displayed, with predefined opions.
maxNew number The input field's maximum value. Use togheter with the "min" attribute to create a range of legal values.
maxlength number Defines the maximum number of characters allowed in a text field.
minNew number The input field's minimum value. Use togheter with the "max" attribute to create a range of legal values.
multipleNew multiple If present the user is allowed more than one value.
name fieldname Defines a unique name for the input element. The name attribute is used to collect the fields value when submitted.
patternNew JavaScript Pattern Defines a pattern or format for the input field's value. Example: pattern="[0-9]" means that the input value must be a number between 0 an 9. Use the standard "title" attribute to describe the pattern.
placeholderNew text Defines a hint to help users fill out the input field.
readonly readonly Indicates that the value of this field cannot be modified.
requiredNew required Defines if the input field's value is required in order to submit the form

Note: Cannot be used with type: hidden, image, button, submit, reset

size number of characters Defines how many characters should be visible in the input field.
src URL Defines the URL of the image to display.

Use with type="image"

stepNew number
any
Allowed when type=date,datetime,datetime-local,month,week,time,number, or range.
type button
checkbox
color
date
datetime
datetime-local
email
file
hidden
image
month
number
password
radio
range
reset
search
submit
tel
text
time
url
week

Indicates the type of the input element. The default value is "text"

Note: This is not a required attribute, but we think you should include it.

value value For buttons: Defines the text on the button.

For image buttons: Defines the symbolic result of the field passed to a script.

For checkboxes and radio buttons: Defines the result of the input element when clicked. The result is sent to the form's action URL.

For hidden, password, and text fields: Defines the default value of the element.

Note: Cannot be used with type="file"

Note: This attribute is required with type="checkbox" and type="radio"

widthNew pixels
%
Defines the width of an input field.

Standard Attributes

The <a> tag also supports the Standard Attributes in HTML 5.


Event Attributes

The <a> tag also supports the Event Attributes in HTML 5.