Color:
Color does just what it says, and uses not only the 16 default colors, but hundreds of others, which I will not put here. Hexadecimal and RGB numbers will work as well.
H4 { color: green }
Background Colors:
Background Color applies a solid color to any element on a page, including an image.
P .first { background-color: *** }
*** can be any color name, hex #, or the word "transparent" which makes any inherited property become null.
Background Images:
You can add background images using either relative or absolute paths.
H4 { background-image: url(blah/blah/boo.gif) }
To make the background image cover the entire window, have the image tied to the <BODY> tag. Also, a value of "none" will cause any inherited trait to become null. In order to add a little more flair to your background images, pair the background-color and background-image tags together just like the following in order to make a solid color show through where the GIF becomes transparent.
H4 {background-image: url(/image/blah.gif); background-color: purple}
Thus, the background color fills in the image.
Controlling the Background:
According to HTML, background images must always tile. Not so in CSS. By applying a small tag along with the background-image tag, you can keep any image from tiling, and shows it only once.
H4 { background-repeat: no-repeat; background-image: url(/image/blah.gif)}
By using "repeat-x" in the "no-repeat" area, and the image tiles horizontally ONLY. Changing "repeat-x" to "repeat-y" makes it tile vertically ONLY. And then, "repeat" just makes it tile normally.
Background-Attachment
This works only with the <BODY> tag. With this tag, one can make an image NOT scroll with the page, the opposite of what we are used to seeing. (NOTE: I am going to make this BODY tag look just a little weird so that your browser doesn't try to apply this to my web page.)
BOdy {background-attachment: fixed; background-image: url(/blah/blah.gif)}
Changing "fixed" to "scroll" will make the picture do what we normally see it doing.
END LESSON 4
Lesson 5