html - 溢出大于 100vh 的 CSS 滚动捕捉点？

Question

当容器高于 100vh 时，我无法实现滚动捕捉点。我想使用强制捕捉点，但也允许用户在高度大于 100vh 时滚动。

我通过在我希望用户能够滚动浏览的位置添加额外的捕捉点来完成这项工作，而无需捕捉到高于 100vh 的 div 的顶部。

.parent {
    min-height: 100vh; //actual is taller than 100vh
    scroll-snap-align: start;
}

.child {
    scroll-snap-align: center;
}

我希望能够自然地在一个高容器中滚动，而不必总是在滚动时捕捉到顶部。这种在 Chrome 中有效，但在 Safari 中，任何溢出都会使用户回到父级的顶部。有没有办法在高于窗口高度的容器上使用捕捉点，同时能够滚动溢出？

Answer 1

添加 overflow-y: scroll给 parent 。

.parent{
   max-height:100vh;
   overflow-y:scroll;
 }

还有 scroll-snap-align进入子元素