android - 固定背景不适用于移动设备

Question

我的包装如下:

#wrapper{
background:url(../images/bg2.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
padding-top:80px;
position:relative;
z-index:5;
}

这在桌面上完美运行，甚至将桌面浏览器的大小调整到 480px 以下，但是当我尝试在 Android 手机上运行它时，它只显示背景的 10% 并且随着页面滚动直到其他 div 隐藏它。我需要它固定在移动屏幕上，而不是在我滚动内容时移动。 background-attachment:fixed 由于某种原因，android 似乎不支持它。但是有些网站可以在移动设备上完美地做到这一点，例如 this one .

所以我需要填写这个媒体查询，这样它也可以在 android 上运行:

@media screen and (max-width: 480px) {
#wrapper{

}
}

Answer 1

剩下的 html 和 body css 是什么？我把它放在我最近做的一个网站上并使用了它。我的 html 和 body 是 100% 容器是 90% 所以你可以一直看到容器周围的图像

html. body {
    width:100%;
    min-height:100%;
    margin:0;
    background-image:url(images/Exeter.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    font-family:'Open Sans',sans-serif;
    font-size:100%;
    color:#036;
 }

#container {
    width:90%;
    margin:auto;
    background-color:#fff;    
 }

这是一个活生生的例子 http://myexeterhome.com/