HTML Home
HTML Tags Reference
Selected Reading
© 2011 TutorialsPoint.COM
|
HTML <input> tag
Function:
The HTML <input> tag is used within a form to declare an input element - a control that allows the user to input data.
Difference between HTML and XHTML:
In HTML the <input> tag has no end tag.
In XHTML the <input> tag must be properly closed.
Example:
<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>
|
This will produce following result:
Online Practice:
To Become more comfortable - Do Online Practice
Attributes:
Attribute | Value | Description |
type | button
checkbox
file
hidden
image
password
radio
reset
submit
text | Specifies the type of control. |
accept | content types | Specifies a comma-separated list of content types that the server accepts. |
accept-charset | charset list | Specifies a list of character encodings that the server accepts. The default value is "unknown". |
align | left
right
top
texttop
middle
absmiddle
baseline
bottom
absbottom | Defines the alignment of content |
alt | alternate text | This specifies text to be used in case the browser/user agent can't render the input control. |
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. |
maxlength | number | Defines the maximum number of characters allowed in a text field. |
name | filed name | Assigns a name to the input control. |
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. |
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". |
value | value | Specifies the intial value for the control.If type="checkbox" or type="radio" this attribute is required. |
Standard Attributes:
Attribute | Description |
class | Document wide identifier |
dir | Specifies the direction of the text |
id | Document wide identifier |
title | Specifies a title to associate with the element. |
style | Helps to include inline casecadubf style sheet. |
lang | Sets the language code. |
xml:lang | Sets the language code. |
tabindex | Helps determine the tabbing order |
accesskey | Access keys (or shortcut keys) |
Event Attributes:
Attribute | Description |
onfocus | Script runs when control gets focus |
onblur | Script runs when control loses focus |
onselect | Script runs when the element is selected |
onchange | Script runs when the element changes |
onclick | Script runs when a mouse click |
ondblclick | Script runs when a mouse double-click |
onmousedown | Script runs when mouse button is pressed |
onmouseup | Script runs when mouse button is released |
onmouseover | Script runs when mouse pointer moves over an element |
onmousemove | Script runs when mouse pointer moves |
onmouseout | Script runs when mouse pointer moves out of an element |
onkeypress | Script runs when key is pressed and released |
onkeydown | Script runs when key is pressed |
onkeyup | Script runs when key is released |
|
|
|