HTML – Stack 2固定Div总是顶部
发布时间:2020-12-14 23:29:11 所属栏目:资源 来源:网络整理
导读:我试图找出最简单的方法来堆叠2固定div一个是动态的,一个是静态的. 我的导航高度为76px固定位置.但我在顶部有另一个div,它将根据数据库值隐藏或显示.它将所有东西都按下应用,问题是当我滚动导航器它应该在哪里但是消息div滚动它的身体应该保持在导航div的顶
我试图找出最简单的方法来堆叠2固定div一个是动态的,一个是静态的.
我的导航高度为76px固定位置.但我在顶部有另一个div,它将根据数据库值隐藏或显示.它将所有东西都按下应用,问题是当我滚动导航器它应该在哪里但是消息div滚动它的身体应该保持在导航div的顶部. .nav { background-color: #000; height: 76px; width: 100%; position: fixed; z-index: 100; } .message{ background-color: #ff0000; height: 50px; width: 100%; } <div class="message">Global Message</div> <div class="nav">Navigation</div> <div id="hero" class="hero"> <div id="content"> <img src="images/icon.png"> </div> </div> 解决方法
只需将固定位置添加到.message,然后向导航添加50px的margin-top,如下所示:
.nav { background-color: #000; height: 76px; width: 100%; position: fixed; margin-top: 50px; z-index: 100; color:#fff; } .message{ background-color: #ff0000; height: 50px; width: 100%; position: fixed; } <div class="message">Global Message</div> <div class="nav">Navigation</div> <div id="hero" class="hero"> <div id="content"> <img src="images/icon.png"> </div> </div> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |