Question

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

问题是：背景图片的大小在iPad Pro横向上爆炸。它可以在桌面上正常运行，也可以在Chrome Dev工具中正确显示，以响应响应/ 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

谢谢！如果我先自己解决问题，请发帖回答。

Answer 1

background-attachment: fixed;

，这是＆＃34; parallax＆＃34;效果似乎一直是个问题。没有它，背景图像以正确的比例显示。必须找到一种方法来在iOS上使用JavaScript为横幅添加视差。

在iPad Pro风景上划分背景图像缩放

1 个答案: