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隐藏它。我需要将它固定在移动屏幕上，而不是在我滚动内容时移动。由于某些原因，android似乎不支持background-attachment:fixed。但是有些网站可以在移动设备上完美地完成，例如this one。

所以我需要填写这个媒体查询，所以它也适用于Android：

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

}
}

Answer 1

你的其他人html和身体css是什么？我在最近做过的网站上使用过它。我的html和正文是100％，容器是90％所以你可以一直看到容器周围的图像

＆＃13;

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;    
 }

＆＃13;

这是一个实例http://myexeterhome.com/

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

1 个答案: