Introduction to CSS Background-attachment Properties basics

This article mainly introduces in the CSS, using the background attachment property Background-attachment can set the background image is with the object scrolling or fixed, need friends can refer to, hope to help everyone.

First, Background-attachment properties

In CSS, use the background attachment property background-attachment to set whether the background image is scrolled or fixed with the object.

Grammar:

background-attachment:scroll/fixed;

Description

The Background-attachment property has only 2 property values. Scroll indicates that the background image scrolls with the object scrolling and is the default option; fixed means that the background image is pinned to the page and that only the other content scrolls with the scroll bar.

Example:

<! DOCTYPE html> 
The preview effect in the browser is as follows:


Analysis:

By dragging the right scroll bar in the browser, you will find that the background image is fixed on the page.

The Background-position property cannot be set after setting background-attachment in IE or 360, otherwise the picture cannot be displayed in the browser. You can test Google Chrome, Firefox browser.