CSS背景图像在iPhone设备上无法正确显示(但适用于Android和chrome "iPhone view")



从IOS设备查看我的网站时,背景图像显示不正确。在Android、PC和MAC网络浏览器等其他设备上也能完美运行。

我已经设置了这些CSS元素与bootstrap模板和尝试不同的组合:

#header {
background-image:url(../img/HS_16.jpg);
-webkit-background-size:;
-moz-background-size:cover;
-o-background-size:;
background-size:cover;
background-position:center center;
background-attachment:fixed;
background-repeat:no-repeat;
position:relative;
min-height: 512px; 
}

有点难以解释,但如果你从IOS设备上访问http://holistiskasystrar.se并将其与任何其他设备进行比较,你就会明白我的意思。

点击她例如,左边是iPhone,右边是chrome

已知iOS Safari在background-size: cover;background-attachment: fixed;

在这里的"已知问题"标签下列出:http://caniuse.com/#search=background-size

但是网上有一堆的解决办法,例如CSS background-size: cover替换移动Safari

最新更新