11.5. Using a Background Image as a Fixed Canvas

As you know from your experiences designing and using Websites, if you define a graphic as the background on a page, the graphic will repeat, or tile, itself to fill up the entire client area of the browser. It will also scroll along with any content that is placed on top of it. This is the normal behavior of backgrounds.

However, with CSS, you can change both of those characteristics. You can define the graphic so that rather than tiling, it simply appears once where it is positioned. Also, more interestingly, you can instruct the background graphic to remain in place while other objects, including text, placed on top of it, effectively scroll over it.

Figure 11-9 and Figure 11-10 show this ...

Get HTML Utopia: Designing Without Tables Using CSS 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.