Background Attachment

suggest change

The background-attachment property sets whether a background image is fixed or scrolls with the rest of the page.

body { 
  background-image: url('img.jpg');
  background-attachment: fixed;
}

Value | Description –– | — scroll | The background scrolls along with the element. This is default. fixed | The background is fixed with regard to the viewport. local | The background scrolls along with the element’s contents. initial | Sets this property to its default value. inherit | Inherits this property from its parent element.

Examples

background-attachment: scroll

The default behaviour, when the body is scrolled the background scrolls with it:

body {
  background-image: url('image.jpg');
  background-attachment: scroll;
}

background-attachment: fixed

The background image will be fixed and will not move when the body is scrolled:

body {
  background-image: url('image.jpg');
  background-attachment: fixed;
}

background-attachment: local

The background image of the div will scroll when the contents of the div is scrolled.

div {
  background-image: url('image.jpg');
  background-attachment: local;
}

Feedback about page:

Feedback:
Optional: your email if you want me to get back to you:



Table Of Contents