滚动滚动时，在Android Chrome上的背景图像下方修复白色条

Question

我正在将背景图像应用到网页上，但是当我在Chrome应用中查看Android设备上的站点时，当我向下滚动时，底部出现了一个白色栏。<<<<<<<<<<<<<</p>

我尝试了从一个旧帖子中找到的解决方案：滚动iOS

时固定背景的白色区域

它在三星Internet应用程序中起作用，但上述解决方案似乎在Android Chrome App

上工作

代码：

body{
  background-image: url('../images/fields-and-tree.jpg');
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  transform: translate3d(0,0,0);
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0)
}

Answer 1

当地址栏消失时，白色条将出现。到目前为止，我发现的唯一纯CSS"解决方案"就是在移动设备上的HTML元素增加一些额外的高度。当存在地址栏时，这将裁剪您的背景图像，但它仍然比在底部拥有那个大的白色条更好。

@media only screen and (max-device-width: 480px) {
    html {
      height: calc(100% + 60px);
      min-height: calc(100% + 60px);
    }
}