css背景随页面拖动

CSS背景随页面拖动是一种常见的网页设计效果，它可以使背景图片或颜色随着页面的滚动而移动，让网页看起来更加生动有趣。

实现CSS背景随页面拖动的方法有多种，其中一种比较常见的方法是通过CSS3的background-size和background-position属性来控制背景图片的移动和缩放。

body {
  background-image: url(bg.jpg);
  background-size: cover;
  background-position: center center;
}
 

上面的代码中，我们设置了一个背景图片bg.jpg，并将背景大小设置为覆盖整个页面，即cover。同时，我们还通过background-position属性将背景图片居中显示。

为了实现背景随页面拖动的效果，我们可以再加上以下代码：

body {
  background-attachment: fixed;
}
 

这个属性指定背景图片固定在视口中的位置，不随页面滚动而移动。因此，当我们滚动页面时，背景图片就会随着页面一起移动。

需要注意的是，CSS背景随页面拖动不适用于移动设备，因为它会消耗很多资源并降低用户体验。因此，在移动设备上，我们通常会采用简单的背景颜色或渐变来代替背景图片。