Chapter 39. Using Background Images on Web Pages

There are two ways to add a background image to a Web page. One is to use HTML attributes. The other is to use CSS style definitions. With HTML, you get limited design options but solid reliability across browsers. With CSS, you get more design options but less reliability.


Beware of background images that overwhelm the content of the page. Stick to washed-out images that don't interfere with the legibility and clarity of your text.

In HTML, you add the background attribute to the body tag, like this:

<body background="images/ufo.gif">

The browser tiles or repeats the image across all available real estate in the browser window, as in Figure 39.1.

Figure 39.1. When you add a background image ...

Get Web Design Garage 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.