为什么背景图像有时不会覆盖整个页面？

Question

我有一个HTML页面，我将图像作为背景。每当我在iPhone 6上查看页面时，背景图像有时并不覆盖整个页面。这种情况只发生在大约20％的时间，并且在重新加载页面后不会发生。当我清除手机上的缓存和网站数据时，总会发生这种情况。这是将它设置为背景的CSS（我通过搜索＆＃34来获取它;如何制作一个好的CSS背景图像＆＃34;）

 html { /*Copied from the web*/
  background: url(img/sea.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}   

body{
    background: none;
}

该网页的网址是msolonko.net/signup.php。

正如您在图像上看到的那样，登录按钮下方有空白区域。为什么图像有时会正常工作，但很少没有？我该如何解决这个问题？

编辑：

更改图像的分辨率对此问题没有影响。 我不希望图像重复。如果问题没有发生，只用一张图片看起来不错。

此外，如果我无法解决此问题，我将仅在图像是计算机时才显示图像。如果设备宽度小于某个阈值，我将只使用背景颜色而不是图像。我仍然希望我能解决这个问题。

Answer 1

两种解决方案：使图像重复（转动不重复重复）或.. 增加sky.jpg的高度，因为sky.jpg不够高，不适合手机。

所以，如果我没有误会（我可能是），你应该让你的sky.jpg图像960 x 660像素。某些平均手机像素分辨率为http://www.binvisions.com/articles/tablet-smartphone-resolutions-screen-size-list/

这应该有帮助！对不起，如果没有。

编辑：你至少尝试过这种技术吗？ （我是Stack的新手，我无法发表评论）

Answer 2

在加载页面之前编辑图像，为它制作正确的大小。 是递归的。 （我有同样的问题，这样做因为我找不到在代码中找到解决方案。） 我使用像photoshop和corel这样的程序。

Answer 3

我明白了！我正在学习一些CSS ... CSS代码：

body {
    background-image:sky.jpg; /*or whatever*/
}

应该工作......也许。