HTML:将加载时的 Div 设置为第二次折叠

Question

我想要一个 div 在页面加载时将 div 设置为另一个折叠。

假设我想在加载网站时在视口(viewport)中打开 div A。如果我向下滚动，Div B 应该在视口(viewport)上。这样我就可以使用按钮向下移动到第二个 div。

我不想在 div b 上使用边距，因为它之后不会响应，对吧？

我希望示例代码能让它更容易理解。

<div class="container">
         <div class="a"></div>
         <div class="b"></div>
</div>

Answer 1

我假设您的意思是 margin-top 使每个 div 成为完整的视口(viewport)。 您可以做的是使用视口(viewport)高度而不是边距来使每个 div 占据视口(viewport)的 100%。这是响应式的。

.a {
    height: 100vh;
    background: black;
}

.b {
    height: 100vh;
    background: yellow;
}

看看这个 JSFiddle .