每当我将导航栏设置为固定且标头高度为100vh时，标头似乎就在导航栏下方。如何使导航栏不覆盖我的标题并使标题100vh
.nav {
height: 80px;
position: fixed;
top: 0;
left: 0;
width: 100%;
background: red;
}
.hero {
background: blue;
height: 100vh;
margin-top: 80px;
}
* {
margin: 0;
}<div class="nav">
</div>
<div class="hero">
</div>使用position: sticky代替position: fixed。这样，您的主容器将始终是100vh。
在CSS中，我进行了编辑。
* {
margin: 0;
}
.nav {
height: 80px;
position: sticky;
top: 0;
/*left: 0;*/
width: 100%;
background: red;
}
.hero {
background: blue;
min-height: 100vh;
/*margin-top: 80px;*/
}<div class="nav">
</div>
<div class="hero">
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句