背景图像在safari和chrome上没有响应

Question

当使用safari或chrome时，我的div背景无法在iphone上正确加载。它在Mozilla中完全响应，但在safari和chrome中，它仍然以100%宽度和100%高度加载。这是"教派"div的背景图像。这是我的html

<div class="sect">

<H1>ALESH</h1>
<h2>This is me</h2>

<FORM METHOD="LINK" ACTION="Artbook.html">
<INPUT TYPE="submit" VALUE="explore my work" class="button1">
</FORM>

</div>

这是我的css for pc

html, body {
height: 100%;
background-color: white;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
background-size: cover;
}
.sect {
height: 100%;
width: 100%;
background-position: absolute;
background: url("homepage/photos/b1.jpg") no-repeat center center      scroll;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
padding: 0;
left: 0;
Right: 0;
margin: auto;
top: -2px;
overflow: hidden;
}

我确实有一个用于"最大设备宽度：480px"的separe css文件。然而什么都不起作用，你知道哪里可能有错误吗？

Answer 1

在头标签中添加此标签

<meta name="viewport" content="width=device-width, initial-scale=1">

Answer 2

我也有类似的东西：背景图像没有在Safari&Safari手机。

问题是关于

background-attachment: fixed

这对于移动浏览器来说有点棘手
对我来说，我只是不得不把它忽略掉。

有时定位不可用。所以试着不用。

也许对你有帮助：
iOS上的固定背景

希望能有所帮助。

附加：
在Stack上也发现了有关该问题的信息。