HTML and CSS Reference
In-Depth Information
The min and max attributes
As we've seen with
<input type=number>
, these
min
and
max
attributes constrain the range of values that can be entered in
an input; you can't submit the form with a number smaller than
min
or larger than
max
. But they can also be used with other
input types—for example,
<input type=date min=2010-01-01
max=2010-12-31>
will only accept a date that's in the year 2010.
It's trivial to make the server write HTML that has a
min
of today,
so only future days are allowed (for a flight booking site, for
example) or a
max
of today (for a field collecting date of birth,
for example).
The step attribute
The
step
attribute controls the level of granularity of input. So
if you want the user to enter a percentage between 0 and 100,
but only to the nearest 5, you can specify
<input type=number mix=0 max=100 step=5>
and the spinner control will increment in steps of 5.
Ta k i n g t h e e x a m p l e of f a t i m e c of n t r of l , y of u c a n a l s of u s e
step=any
.
This allows any time in the day to be selected, with any accu-
racy (for example, thousandth-of-a-second accuracy or more);
normally, time controls are limited to an accuracy of one minute.
<input name=favtime type=time step=any>
The form attribute
Traditionally, form controls all needed to be inside a
<form>
element. If, for whatever reason—design, styling, or the like—
authors wanted to have a form somewhere on the page and
some other related controls somewhere else, they would (in the
worst case) wrap the entire page up in a form element.
But—brave new world!—in HTML5, a number of elements
that were previously required to be within a form element
(
<button>
,
<fieldset>
,
<input>
,
<label>
,
<select>
,
<textarea>
,
plus
<object>
and the new elements like
<keygen>
,
<meter>
,
<output>
, and
<progress>
) can now be anywhere on the page
and associated with a form using a
form
attribute pointing at
the
id
of its form owner.
