我们正在尝试拥有一个固定的背景图像，该图像涵盖了我们内容的整个视口（因此，就像墙纸上面漂浮在壁纸上）一样。这是我一直用来完成此操作的代码：
<html>
<head>
<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1">
</head>
<body>
<div>
</div>
<style>
div {
height: 150vh;
background: url(https://www.google.com/logos/doodles/2019/spring-equinox-2019-northern-hemisphere-5139135894388736.3-l.png) no-repeat center fixed;
background-size: cover;
}
</style>
</body>
</html>
您也可以在这里查看：http：//neonorb.com/background-test.html
在桌面铬和Firefox以及移动Firefox上，这是我所期望的。也就是说，容器为150VH，您可以在背景图像静止时滚动。
但是，如果您在移动铬中查看它，则图像占用其容器的整个高度（即150VH），实际上滚动并未修复。
这是移动铬中的错误吗？还是这种行为实际上是正确的，而该错误实际上位于桌面铬和两个Firefoxes中？还是我做错了什么？
编辑：
对background-size:cover;的行为进行了一些研究...它说cover仅涵盖"背景定位区域"。而且本身就可以了。
但是，当您还应用background-attachment:fixed;时，图像被视为position:fixed;。
那么，为什么大多数浏览器似乎都涵盖了整个视口，但是移动铬不会？
如果您将背景应用于DIV，而不是身体元素本身；确保您的DIV保持与视口相同的大小（或您希望背景覆盖的区域）：
#div-with-background {
display: block;
position: fixed;
width: 100vw;
height: 100vh;
left: 0;
top: 0;
margin: 0;
background: url(https://www.google.com/logos/doodles/2019/spring-equinox-2019-northern-hemisphere-5139135894388736.3-l.png) no-repeat center fixed;
background-size: cover;
}
您还需要删除HTML和身体标签上的边距：
html, body {
margin: 0;
padding: 0;
}
小提琴：https：//jsfiddle.net/ne95d4za/
您将在移动野生动物园上看到相同的"错误"。实际上，情况更糟，因为Chrome自动将背景大小设置在封面上，Safari不会。
我认为停用的原因是避免触摸屏上的错误，Wich存在固定元素的问题。
我没有在不使用视差效果的情况下找到解决方案，但很高兴知道如何解决该问题。