Complex Backgrounds
Having
covered the basics of foreground and
background colors, we turn now to the subject of background images.
In HTML, it’s possible to associate an image with the
background of the document by using the BODY
attribute BACKGROUND:
<BODY BACKGROUND="bg23.gif">
This will cause a user agent to load the file
bg23.gif and then “tile” it in the
document background, repeating it in both the horizontal and vertical
directions to fill up the entire background of the document, as shown
in Figure 6-22.
Figure 6-22. Applying a background image in HTML
This effect can be duplicated in CSS, but CSS contains a great deal more than simple tiling of background images. We’ll start with the basics and then work our way up.
Background Images
In order to
get an image into the background in the first place, the property
background-image is used.
The default value of none means about what
you’d expect: no image is placed in the background. If you want
a background image, then you need only give this property a
URL value:
BODY {background-image: url(bg23.gif);}
Due to the default values of other
background properties, this will cause the image
bg23.gif to be tiled in the document’s
background, as shown in Figure 6-22.
It’s usually a good idea to specify a background color to go along with your background ...
Get Cascading Style Sheets: The Definitive Guide now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
