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