All You Can Do With: Forms INPUT

W3 Org on INPUT
Not showing in this AYCD page.
  1. type: "hidden" not shown
  2. tabindex is available to control the tab order.(tabindex="5" {index order number}).
  3. alt - not relavent
  4. JavaScript
    • onfocus
    • onblur
    • onselect
    • onchange
    • onclick
    • ondblclick
    • onmousedown
    • onmouseup
    • onmouseover
    • onmousemove
    • onmouseout
    • onkeypress
    • onkeydown
    • onkeyup
    • accept

Basic Basic Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50">
Alternate (Not going to repeat this in examples)
Secret Stuff:
Secret Stuff: <INPUT Type="password" Name="Basic" Size="20" Value="Basic Example" maxlength="12">
readonly Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" readonly>
disabled Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" disabled>
tabindex Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" tabindex="1">
accesskey Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" accesskey="U">

font-family Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="font-family: Courier;">
cursive
fantasy
monospace
sans-serif
serif
font-size Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="font-size: 9pt;">
larger
smaller
xx-small
x-small
small
medium
large
x-large
xx-large
font-weight Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="font-weight: bold;">
normal
bold
bolder
lighter
100
200
300
400
500
600
700
800
900
background-color Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="background-color: 336699;">
Can be defined using HEX values (#FFFFFF), or by using color names (red, blue, aqua). {Don't have to use the "#" for HEX, but it makes more sence IMHO}.
border-color Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="border-color: 336699;">
Can be defined using HEX values (#FFFFFF), or by using color names (red, blue, aqua). {Don't have to use the "#" for HEX, but it makes more sence IMHO}.
border-style Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="border-style: ridge;">
none
dotted
dashed
solid
double
groove
ridge
inset
outset
border-width Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="border-width: 3px;">
thin
medium
thick
color Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="color: 336699;">
Can be defined using HEX values (#FFFFFF), or by using color names (red, blue, aqua). {Don't have to use the "#" for HEX, but it makes more sence IMHO}.
Some Nice Buttons Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="color:#050; font-family:'trebuchet ms',helvetica,sans-serif; font-size:84%; font-weight:bold; background-color:red;">
Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="color:#050; font-family:'trebuchet ms',helvetica,sans-serif; font-size:84%; font-weight:bold; background-color:red; border:1px solid; border-top-color:#696; border-left-color:#696; border-right-color:#363; border-bottom-color:#363;">
Example:
<INPUT Type="Button" Name="Basic" Size="45" Value="Basic Example" maxlength="50" style="color:#050; font-family:'trebuchet ms',helvetica,sans-serif; font-size:84%; font-weight:bold; background-color:red; border:1px solid; border-top-color:#696; border-left-color:#696; border-right-color:#363; border-bottom-color:#363; filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffffffff',EndColorStr='#ffeeddaa');">

Here is some button hover stuff: