One of the most important elements of a web site is the background. It has a great effect on the appearance of your site and if you have a beautiful background design, the visitors will be attracted to your site and chances are, they will pay frequent visits to your page. It is an important factor that any
web designer considers because before a person can read the text content of the site, the first thing they will notice is the background.
A basic rule in setting a background is that its color should contrast with the text. Meaning if the background is dark, the text should be light and vice versa. Using CSS you can set the background color of your site and control how the background image is displayed. For now we will be focusing on
manipulation of color of your background to compliment with your text. There are many colors available and you can control the individual values of the RGB to enhance its hue.
h4 { background-color: white; }
p { background-color: #1078E1; }
ul { background-color: rgb( 149, 206, 145); }
As seen above, you can use the color's name, its hexadecimal value or the RGB range. Of course you are not expected to memorize the name,
hexadecimal value, and RGB of every color so browse through the net find them out. Here's an example of a colored background:
<! - CODE SAMPLE - !>
<html>
<head>
<style type="text/css">
body {background-color: white}
h1 {background-color: #00ff00}
h2 {background-color: blue}
p {background-color: rgb(250,50,25)}
</style>
</head>
<body>
<h1>header with green background</h1>
<h2>header with blue background</h2>
<p>paragraph with red background</p>
</body>
</html>
<! - End Sample - !>