Form Effects

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.

Templates Resource Hosting
Domain Names · Templates Resource