Intro
Knowing how color works in HTML can help you match
colors from various sources. For example, if you are
creating a new logo for your school and you want it
to match the colors on your school web site, you can
easily do this by writing down the corresponding color
code.
In HTML, color codes are called hexadecimal
numbers and look something like this: #99FF00.
Without going too much into what the numbers mean,
know that the first two numbers (or letters) indicate
what shade of red to use, the second set of
two numbers is for green, while the last set
of two numbers represents blue.
Dreamweaver handles colors with great
ease. Using the color picker, you should have no problem
selecting a wide assortment of great colors. However,
if you want to use a specific color (perhaps one that
matches an existing school logo), then using hexadecimal
numbers cuts down on the frustration factor.
Of special interest to us is how to change
the background of a web page. Recent web design trends
use background color and repetitive background images
to create very cool effects. Now, I'm not talking
about just duplicating a logo in the background.
Designers use background images to create great sidebars.
In fact, the web page you are looking at right now
uses a repetitive background image to create the sidebar.
Designers use background color to create rounded corners,
which give your web site a sleek, 21st Century look
and feel.
 |
For a great article on how to make
rounded corners, visit SitePoint. |
Changing the background color of your
page is done by adding a simple code to the <body>
tag. Here's what it should look like:
<body bgcolor="#990099">
When you want to change the background
color of a page, you simply find the HTML code and
change the six digit hexadecimal number.
|
For basic colors, you can often
just type in the name of the color (e.g.
blue, yellow, etc.) |
Demo
Follow these steps to change the color
of this page.
Not so fast. Since this page uses a background
image and not a background color, I don't want to
confuse the issue. Click here
to go to a new page without the background image attached.
