HTML and CSS Reference
In-Depth Information
Figure 4-10: A color scheme applied to a page.
81
TAKE THE WHEEL
h e following two challenges should be fun, and you'll learn a lot from doing them both:
Reproducing the standard color chart:
In Figure 4-1 is an image with the standard
colors. Your i rst challenge is to see if you can reproduce the Web page that displays those
colors. Here are a couple hints to get started:
•
Dei ne each named color as a class in your
<style>
container with the same color
for the text and background colors.
.
aqua
{
color
:
aqua
;
background
-
color
:
aqua
;
}
•
One way to do this is to use the
<span>
tag to assign classes to the content of the
<span> container.
<
h3
>
<
span class
=
aqua
>
COLORNAME
</
span
><
span class
=
black
>
COLORNAME
</
span
><
span class
=
blue
>
COLORNAME
</
span
><
span class
=
fuchsia
>
COLORNAME
</
span
>
<
h3
>
Your picture belongs on a Web page!
h is is a three-part task:
1.
Make a digital image of yourself using the built-in camera on your computer or
upload one from a digital camera.
2.
Load the image into Kuler and create a color palette.
3.
Create a Web page with your picture using the color palette you created in Kuler.