css - 防止背景图像缩放

Question

我希望实现与我发现的这个网站类似的效果:http://www.august.com.au/

在这个网站上，如果你放大/或缩小 ctrl +/- 背景不会改变。只有内容缩放。

我希望能够为我的网站设置背景图片，并且无论屏幕分辨率或缩放选项如何，背景图片始终填满屏幕。

我知道您可以使用 width:100% 来填充页面，但我的理解是，这是在加载页面时应用的，如果用户在加载后缩放图像，则不会重新调整大小。

有人对从哪里开始这件事有什么建议吗？我曾尝试在网上搜索信息，但找不到太多。

此外，我猜测这将使用 JavaScript 而不是 css 之类的东西来实现？？

Answer 1

This worked for me in chrome, firefox

.someImage {
    width: 7%;
    height: 0;
    padding-bottom: 7%;
    background-image: url('../img/myImage.png');
    background-repeat: no-repeat;
    position: fixed;
    bottom: 5%;
    left: 5%;
    background-size: 100% 100%;
}