将拉伸图像添加为div / site background

Question

尝试使用该代码执行此操作：

 #background {
background-image: url(background_image.jpg);
background-size: 100%;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}

但问题是，当我向下滚动网站时，没有图像而是空白区域。我怎么能解决它？

Answer 1

为什么不尝试这个？

body {
   background-image: url("background_img.jpg");
   background-size: 100vw 100vh;
   background-attachment: fixed;
}

vw是视口宽度，即设备屏幕的宽度。 vh是视口高度，即设备屏幕的高度。

使用background-size: 100vw 100vh属性，背景图像会自动调整为用户设备屏幕的大小。