Positioning Background Images

By default, background images scroll together with their parent elements. So, if you have a page that can be vertically scrolled, the background image moves with the page while you scroll up and down. You can change this behavior with the background-attachment property.

The background-attachment property

This property can have one of these values: scroll where the background scrolls along with the element, fixed where the background is fixed with regard to the current browser window, and local where the background scrolls along with the element’s contents.

The image below shows the difference between the scroll and fixed values.