Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
the checkbox a name so you can refer to it your scripts later on. The text<br />
between the tags ('one') is what appears next to the tick box.<br />
Other input types include:<br />
text - a text box.<br />
radio - a set of options where only one can be chosen.<br />
button - a clickable button.<br />
file - a box that allows someone to upload a file to your site.<br />
submit - a special kind of button that sends the result of the form to the<br />
server.<br />
reset - a button that clears everything a user has entered in the form, so they<br />
can start over.<br />
Web Forms and CSS.<br />
Those forms you just made, however, aren't going to be pretty: they'll be<br />
displayed in only the most basic style, one after the other and surrounded by<br />
ugly boxes. Luckily, it's simple to add some styling using CSS in exactly the<br />
same way as you would add it to normal text. You can change the boxes'<br />
background-color, font (font-family), remove the borders, and so on.<br />
You might also like to make use of the various CSS 'events', such as the hover<br />
event. Take a look at this example CSS:<br />
input:hover {<br />
background-color: yellow;<br />
}<br />
It makes the input box go yellow when the user hovers over it – combine that<br />
with a bit of JavaScript that automatically moves the typing cursor into input<br />
boxes that the user hovers over, and you've got an easier to use form right<br />
away. Try as much as you can to make your input boxes look and behave like<br />
ones you like in software you find easy to use, and you won't go far wrong.<br />
Validating Input.<br />
Once the user has typed something in, you need to validate it – that is, check<br />
it makes sense. If they're supposed to be filling in an email address, there<br />
The Web Design Guide for Newbies |106
Change language