iPad Pro 横向上的 Div 背景图像缩放答案

【问题标题】：Div background image scaling on iPad Pro landscapeiPad Pro 横向上的 Div 背景图像缩放
【发布时间】：2018-02-23 18:28:22
【问题描述】：

尝试解决我的标题 div 的背景图像问题，以使其完全响应。

问题是：背景图像的大小在 iPad Pro 上横向放大。它可以在台式机上正常工作，也可以在 Chrome 开发工具中正确显示，用于响应式/iPad Pro 横向。我目前观察到此问题的唯一实例是 - iPad Pro 横向（Safari 和 Chrome）。请参阅随附的代码和屏幕截图。

网址：rita.im title.jpg文件大小为2464 × 1632

Div 的 CSS

`.bgimage {
    position: relative;
    background-image: url(../img/title.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-position: top center;
    width: 100%;
    height:100vh;
    bottom: 0;
    overflow: hidden;
    background-attachment: fixed;
    background-color: #fff;
    margin: 0;
    padding: 0;
}`

Chrome Dev tools preview

Actual iPad Pro landscape display

谢谢！如果我先自己解决问题，将发布答案。

【问题讨论】：

检查是否有任何东西在视口之外。在 iPad 上向左滑动以查看是否可以。如果一切都在视口中，您不应该能够。只是一个想法，不是真正的答案。
感谢您的回复。不，外面什么都没有，一切都适合宽度。

标签： html ipad background responsive

【解决方案1】：

background-attachment: fixed;

，“视差”效果似乎是问题所在。没有它，背景图像将以正确的比例显示。必须找到一种方法来使用 JavaScript 在 iOS 上为横幅添加视差。

【讨论】：