Color and Background Properties

Color

The color property changes the foreground color of a section, which is usually text. So, to change the color of some text:

This text is plain, <SPAN style="color:orange">and this makes me think of pumpkins....</SPAN>

That would give us the following sentence:

This text is plain, and this makes me think of pumpkins....

Background-color

This property will let you add a background color behind most anything. You can add it to text like this:

<SPAN style="background-color:yellow">My background is yellow!</SPAN>

And you get a beautiful yellow background.....

My background is yellow!

Also, you can use this in tables:

<TABLE style="background-color:orange" border="1">
<TD>AAAGH! Pumpkin Background!
</TABLE>

And you get the old orange background.....

AAAGH! Pumpkin Background!

And how about a form box? Of course!

<FORM>
Name: <INPUT TYPE="text" size="25" style="background-color:green">
</FORM>

Now just look at this........

Name:

Background-image

This is the same as a background color, but it uses an image you specify instead of a color. Also, you have to write it a little differently, using a url call:

background-image:url(http://www.hornetdesign.com/AUSTRIANTEAM.jpg)

After the colon, you write "url". Then you put the url inside a set of parentheses, with no quote marks around it. Here it is in action:

<SPAN style="background-image:url(http://www.hornetdesign.com/AUSTRIANTEAM.jpg)">
Can you even read this?
</SPAN>

And we get a background that no one can read over!

Can you even read this?

And of course, the table:

<TABLE style="background-image:url(http://www.hornetdesign.com/AUSTRIANTEAM.jpg)" border="1">
<TD>hmmm orange!!/TD>
</TABLE>

And you get the image background.....

can u read this

And how about a form textarea this time? Well, O.K.....

<FORM>
<TEXTAREA rows="10" cols="50" style="background-image:url(http://www.hornetdesign.com/AUSTRIANTEAM.jpg)">
</TEXTAREA>
</FORM>

This is what it looks like, please wait tho pic takes little while to load