Spring Into HTML and CSS

Fixing and Scrolling Background Images

You can have your background image fixed to the browser's viewport, or allow it to scroll along with the document by using the background-attachment property along with a value of either fixed or scroll.

Typically, this is used for either the entire body or content areas within the document. However, as you've seen so far, you can use it in any element where it makes sense to do so.

Consider the following rule:

body {background-image: url(arrows.gif); background-position: right; background-repeat: no-repeat; background-attachment: scroll;}

Here, I've attached a background image, positioned it to the right with no repeat, and scrolled the background. This actually creates a rule that mimics default ...