CSS background-attachment

 The function of CSS background-attachment can be used to determine whether the background image should move up and down with the scroll of the mouse. There are two different presentation schemes. The first is that when the mouse scrolls up and down, the background image will scroll up and down. The second when the mouse is kind of scroll up and down, the background image is fixed, rendering web pages is like the subject and the background is separate from the main page seems to be floating above the background feeling, background-attachment and background images often ( background -image ) Matching design.

CSS background-attachment basic syntax

background-attachment: display parameters;

The selectable values of the display parameters in the basic syntax are scroll and fixed, as shown in the following table.

parameter	definition
scroll	By default, the background image will move up and down as the mouse scrolls.
fixed	The background image is fixed, and scrolling the mouse up and down will only move the main body of the page.

CSS background-attachment example

body{
　background-image:url(picture URL);
　background-attachment:fixed;
}

In the above example grammar, the picture you give will be fixed, no matter how the web page is pulled, the picture will be fixed at the position you set. Occasionally, designers also use the background-repeat effect to design a style that does not repeat the background image. All mainstream browsers support the background-attachment effect.

The effect of background-attachment is the same as object.style.backgroundAttachment="fixed" in JavaScript .