How to set the background image not to scroll as the text content scrolls

We can fix the image through the fixed value in the background-attachement attribute so that it does not scroll with the scrolling of the text content

The background-attachement attribute is mainly defined Whether the background image scrolls with the content or remains fixed

Its attribute value is

fixed: Indicates that the background image remains fixed in the browser window and remains fixed when scrolling the element Or the page does not move.

scroll: Indicates that when the document scrolls, the background image scrolls with the object

In the following case, use "fixed" in the background-attachment attribute to make the background It will not scroll as the text scrolls

	body{
		background-image: url("images/7.jpg");
		background-attachment:fixed;
		background-repeat: no-repeat;
		}

Rendering:

Change fixed to scroll, the background image will scroll as the text scrolls

body{
		background-image: url("images/7.jpg");
		background-attachment:scroll;
		background-repeat: no-repeat;
		}

Rendering:

Summary: So we can set the background-attachment attribute to fixed to make the image fixed.

The above is the detailed content of How to set the background image not to scroll as the text content scrolls. For more information, please follow other related articles on the PHP Chinese website!