CSS background-attachment Property

Description

The background-attachment property if specified, the background-attachment CSS property determines whether that image's position is fixed within the viewport, or scrolls along with its containing block.

  • Initial valuescroll
  • Applies toAll elements
  • InheritedNo
  • MediaVisual
  • Computed valueAs specified
  • AnimatableNo
  • CSS VersionCSS1, CSS2, CSS3
  • JavaScript syntaxobject.style.backgroundAttachment

Syntax

Formal syntax: <attachment> [ , <attachment> ]*

background-attachment: scroll;
background-attachment: fixed;
background-attachment: local;

Values

<attachment> = scroll | fixed | local
  • scrollBackground image scrolls with the object as the document is scrolled.
  • fixedBackground image will not scroll with its containing element, instead remaining stationary within the viewport.
  • localBackground image will not scroll with its containing element, but will scroll when the element's content scrolls: it is fixed regarding the element's content.
  • inherit

Example

.class {
   background-image: url(img/myimage.gif);
   background-attachment: fixed;
}

Give it a Try

Click the button below to experiment with this property.

Give it a Try!

Browser Support

1+Firefox7+Explorer1+Chrome1+Safari8+Opera

Last updated on 23rd March 2014 By Rene Spronk

View All CSS Properties

Errors? Please help to keep this list up to date, If you find any errors, please contact us, so that we can get them fixed.