设置背景图像以填充整个页面

Question

首先，我知道有很多关于此问题的主题，但我似乎无法在这个特定页面上做到正确。

我花了无数个小时试图做到这一点，我为我网站上的大多数页面都做了，但这个我不能正确。所以这就是我现在所拥有的：

body, html {
height: auto;
min-height: 100%;

}

body {
background-image: url(../images/image.png);
min-width: 1200px;
background-repeat: no-repeat;
height: auto;
min-height: 100%;
background-size: 100% 100%;
background-size: cover;

}

它在大屏幕上工作得有点好但在移动设备上，机身并没有覆盖整个屏幕（大屏幕也没有，但无论如何图片都会填满整个屏幕）。

我知道我可以使用

    background-attachment: fixed;

当我在Windows上测试Chrome中的不同分辨率时似乎工作正常，但是当你在Android上实际尝试它时，它不起作用，因为那里不支持。

Answer 1

完全适应＆＃34;几乎在任何现代浏览器上都可以使用background-size属性以及vw（视图宽度）和vh（视图高度）单位：

https://jsfiddle.net/op662k7u/

#b{
  background-image: url('https://backgroundss.files.wordpress.com/2013/08/rainbow-background-images.jpg');
  background-size: 100vw 100vh;
}

或者如果你只想要应用高度和宽度来遵循它的比例：

#b{
  background-image: url('https://backgroundss.files.wordpress.com/2013/08/rainbow-background-images.jpg');
  background-size: auto 100vh;
}

Answer 2

Android不使用px，将其转换为dp，搜索google：px到dp。然后设置高度，任何方式高度100％应该工作，不需要最小高度