Prev | Current Page 401 | Next

Craig Grannell

"The Essential Guide to CSS and HTML Web Design"


This button used to be common online, enabling the user to reset a form to its default
state, removing any content they??™ve added. However, I??™ve never really seen the point in
having it there, especially seeing as it??™s easy to click by mistake, resulting in the user having
to fill in the form again, hence its absence from the examples in this chapter. However,
if you want to add such a button, you can do so by using the following code:

Improving form accessibility
Although there??™s an onscreen visual relationship between form label text and the controls,
they??™re not associated in any other way. This sometimes makes forms tricky to use for
those people using screen readers and other assistive devices. Also, by default, the Tab key
cycles through various web page elements in order, rather than jumping to the first form
field (and continuing through the remainder of the form before moving elsewhere). Both
of these issues are dealt with in this section.
The label, fieldset, and legend elements
The label element enables you to define relationships between the text labeling a form
control and the form control itself. In the following example, the Name text is enclosed in a
label element with the for attribute value of realname. This corresponds to the name and
id values of the form field associated with this text.




Most browsers don??™t amend the content??™s visual display when it??™s nested within a label
element, although you can style the label in CSS.


Pages:
389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413