Graphics Programs Reference
In-Depth Information
h at similarity extends into the way background are composited together. You may have
noticed that I split out the
background-color
declaration in order to have a nice l at white
behind all the images. But what if you wanted to fold it into the
background
declaration?
Where would you put it? At er all, each of these comma-separated values sets up its own
background. Put the color in the wrong place, and one or more images will be overwritten by
the color.
As it turns out, the answer is the last of the values.
.quotebox
{
background
:
url(bg01.png)
top
left
no-repeat,
url(bg02.png)
top
right
no-repeat,
url(bg03.png)
bottom
right
no-repeat,
#FFF
url(bg04.png)
bottom
left
no-repeat
;}
h at's because the multiple background go from “highest”—that is, closest to you as you look
at the page—to “lowest”—furthest away from you. If you put the color on the i rst back-
ground, it would sit “above” all the others.
h is also means that if you want some kind of patterned background behind all the others (as
in Figure 7-29), it needs to come last and you need to make sure to shit any background color
to it.
254
.quotebox
{
background
:
url(bg01.png)
top
left
no-repeat,
url(bg02.png)
top
right
no-repeat,
url(bg03.png)
bottom
right
no-repeat,
url(bg04.png)
bottom
left
no-repeat,
#FFF
url(bgparch.png)
center
repeat
;}
Figure 7-29: One element, fi ve backgrounds.
Search WWH ::
Custom Search