我正在尝试构建一个具有初始“目标网页”外观的网站,然后您可以向下滚动以查看其余内容。
我可以轻松创建一个适合我正在使用的设备屏幕的div,但是如何为不同屏幕尺寸的其他设备编码呢?
我尝试过使用'100%'当然最初有效,但滚动时会继续填充屏幕。我已经尝试定义一个特定的宽高比,但是,这只适用于我正在处理的屏幕。
要清楚,我希望div或img在用户首次登陆时填充屏幕,然后当用户滚动div / img时应该向上移动页面的其余部分。
我想只使用HTML或CSS来实现这一目标。
提前感谢任何提示!
答案 0 :(得分:2)
您可以在第一个vw
上使用vh
和<div>
来填充视口。您可以将其用作参考:https://developer.mozilla.org/en/docs/Web/CSS/length
答案 1 :(得分:0)
这就是诀窍:
.full-page-container {
width: 100vw;
height: 100vh;
}
vw
和vh
单位表示视口大小的百分比。因此100vh
将意味着视口高度的100%,并且不会受到滚动的影响。