我已经看到很多关于这个问题的帖子，但我似乎找不到解决办法。
我有一个带有背景图片的 div，它的大小设置为覆盖。
除了移动 chrome 之外，它在所有浏览器和设备上都能正常工作，每当我上下滚动页面时，背景图像似乎都会调整大小。我还注意到一个奇怪的错误，如果你把background-size:cover放在background-image:url('')之前它会忽略background-size属性，但是如果你把它放在声明背景图像之后，它会检测大小并将其设置为覆盖，但随后有奇怪的调整大小滚动错误。
这让我发疯了！有谁知道解决办法吗？
【问题讨论】：
标签： html css google-chrome background-image
对此的实际解决方案是在您的 CSS 中设置 html { height: 100% }。
请注意，这并不能解决与 URL 栏高度相关的 Chrome 视口大小错误 - 也就是说，当您向上滚动并且 URL 栏隐藏时，视口大小不会改变，background: cover 最终约为 50px实际上没有覆盖整个视口。
您可以通过设置html { height: 115% } 来解决此问题，但修复该错误后此行为可能会发生变化。
【讨论】：
您的问题不是背景封面，而是当您滚动页面时，浏览器的导航栏（地址栏）正在调整大小。这会导致调整可用视口的大小。由于您的背景设置为覆盖，它会尝试覆盖新可用的区域，显示为图像调整大小。
您可以有多种解决方案。
1. 使您的全尺寸容器绝对或固定定位
2. 页面加载完毕后，给你的容器一个height（或max-height）。这样，一旦页面被加载，即使页面滚动，元素的高度也会保持不变
根据页面的功能和可能包含的其他内容，您需要进行更多调整。
这个问题类似于有封面背景，文本句子在调整大小时换行，增加了容器高度。
【讨论】：
vh 高度，因此它试图匹配新的可用高度。不幸的是，固定或绝对 div 不是一个选项，所以我只是在 JS 中计算出屏幕的大小，并根据屏幕大小以 px 为单位动态设置高度
我刚刚在 chromium-browser 上遇到了类似的背景图片问题。当我在我的风格中使用background-size: cover 时，图像似乎被稍微放大了，这意味着我所有的居中都“关闭”了，并且我的图形的右侧边缘很模糊。
我不得不把这种风格元素去掉。
这个问题在 chromium-browser 65 版中不存在，但在 72 版中却让我感到困扰
【讨论】：