iphone - CSS背景尺寸在移动设备上损坏

我正在建立带有标头元素的网站，该标头元素具有固定的全屏背景图像。除了在移动设备上，它完全可以按预期工作。我的iphone / ipad上的Safari和Chrome都无法正确显示它-似乎缩放到比标题元素大得多的尺寸。

这是完整的网站：http://www.loganmerriam.com/

和有关的CSS：

header {
  background: url(../img/bg.jpg) no-repeat center center fixed;
  -webkit-background-size: 100% auto;
  -moz-background-size: 100% auto;
  -o-background-size: 100% auto;
  background-size: 100% auto;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

即使当我使用媒体查询加载较小的背景时，它仍仅显示图像的一小部分。

还可以有人引导我找到在idevices上检查CSS的好方法吗？

最佳答案

不确定是否会有很大帮助，但是http://screenqueri.es/index.php可能有用。

关于iphone - CSS背景尺寸在移动设备上损坏，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17901387/