且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

CSS:滚动时背景图像不填充

更新时间:2022-05-31 23:36:47

它是烦人。问题是我不能改变HTML,只能改变CSS,所以我不能删除额外的div。

I had the same problem and it is annoying. Problem for me was that I could not change the HTML, only the CSS, so I couldn'y remove the additional divs.

我看到的问题是,背景有width:100%,容器有width:900px。因此,例如,如果浏览器窗口宽800px,背景设置为800px,因此,当您水平滚动窗口时,您将获得没有背景的区域。

The problem as I see it is that the backgrounds have "width: 100%" and the container has "width: 900px". So, for example, if the browser window is 800px wide, the backgrounds are set to 800px and, therefore, when you scroll the window horizontally, you get the areas without the background.

另一种解决问题的方法是从背景中删除width:100%,并将其替换为min-width:900px,从而强制背景总是至少与容器的宽度相同。当窗口大小变得小于900px时,背景总是保持与容器相同。工作。

Another way to fix the problem is to remove the "width: 100%" from the backgrounds and replace it with a "min-width: 900px", thus forcing the backgrounds to be always at least the same width as the container. When the window size becomes less than 900px, the backgrounds always remain at the same with as the container. Works a treat.