Let's start off with an example of what you can do.
As you can see, instead of a dull white and gray form,
you can have pretty pink and vivacious blue. The code for
it is very simple too, take a look:
<form name="myform">
<input type="Text" style="color: #460046;
font: 11px Verdana; background-color: #FFBBFF; border-width:
1; border-color: #000000; border-style: solid; width: 150;">
<input type="submit" name="submit" style="color:
#FFFFFF; font: 10px Verdana; background-color: #1F7CF0;">
</form>
You can see the different attributes I used. They are:
color (the color of the font), font (the size in pixels
and typeface of the font) background-color (the color of
the background), border-width (the width of the border),
border-color (the color of the border), and border-style
(the style of the border). These are most of the important
attributes you would want to change when customizing forms,
but there are also many more. You may use any style attributes
available in most recent CSS standards. This site has a nice list of them all.
A great way to make life easier while coding is to an external
CSS file to store your form styles. Instead of all that
code that I had to write above, I could simply use CSS
to get the forms looking the way I want. For example, in
your .css file, create a class called "myform" that
contained every attribute following "style" and
within the quotes. Once that is done, you could use just
his to display your formatted form:
<form name="myform">
<input type="submit" class="myform">
</form>
I highly recommend using CSS files to define all of the
various styles of text, links, form fields, and other elements
used in your pages. They save time, code, and make style
changes much easier.
|
