css - 如何使此背景图像适合我的页面底部

Question

我正在使用适合浏览器窗口的可缩放背景图像的网站上工作，但在小型浏览器窗口上查看时遇到问题。

当页面最初在一个高大的浏览器窗口上加载时，图像正确地锚定到浏览器窗口的底部，并在调整窗口大小时缩放 - 即，当整个页面被包含时它很好。但是，如果页面长度超过初始窗口高度，当页面滚动时，图像会向上滚动，留下一个空隙。

这是一个要演示的页面（先尝试高窗口，然后是短窗口，刷新并向下滚动以查看问题）：

如何使背景图像适合浏览器窗口的底部和/或在滚动时不留空隙？

score 1 · Accepted Answer

您需要指定宽度\高度，以便它可以正确调整自身大小。

看到你已经使用 css 设置背景，你可以使用 CSS3 背景大小。大多数现代浏览器都支持它，如下所示：

#about-us {
    background-size: 100%;
}

或者，您可以使用正确的图像标签和样式（宽度\高度），占 100%

参考：

希望这可以帮助。

1 回答 1