Css 如何使iPad自动缩放也有溢出的大宽度元素：滚动到完全显示？

首先，我不是在开发一个响应性强的设计页面。所以我没有补充

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

我打算在iPad上实现一些滚动效果。由于iPad不会在滚动动作停止前触发window的滚动事件，所以我必须在一个大的overflow-y:scroll中滚动页面内容；元素

---

有人知道如何解决这个问题吗？我只需要iPad自动缩小显示全宽，不需要水平滚动

如果我理解正确，您将希望开始设置高度：100%；在你的容器上。如果您将容器高度设置为100%，它将始终采用其所在屏幕的高度。然后，将截面高度设置为100%将使它们始终以屏幕大小的100%填充相同的空间。这将使图像定向到100%，但仍允许您滚动

<style>
section {
    width: 1250px;
    height: 800px;
    background: url(http://placehold.it/1250x800) no-repeat 50% top;
}
</style>

<div class="container">
    <section></section>
    <section></section>
    <section></section>
    <section></section>
</div>

.container {
    overflow-y: scroll;
}