HTML / CSS背景图片无法在Safari

Question

我在Safari（尤其是iPhone）上进行背景图像缩放时遇到问题。

以下是iPhone的外观：

以下是它的外观（至少）：

这是CSS代码：

#home {
background-color: rgba(0,0,0, .5);
background-image: url(../img/header-bg.jpg);
background-position: bottom;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
position: relative;
text-align: center;}

img {
vertical-align: middle;
max-width: 100%;
height: auto; }

我忘了提到“home”是<section>标签的“id”。我们的想法是为这个“#home”<section>使用图像背景。

Answer 1

我没有野生动物园，试试吧：

#home {
    height: 500px;
    background-color: rgba(0,0,0, .5);
    background-image: url(../img/header-bg.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-attachment: fixed;
    position: relative;
    text-align: center;
}