我正在使用Twitter Bootstrap,并希望修改移动导航栏,使其展开时下拉菜单覆盖页面内容而不是将其向下推。我知道我可能需要将包含
的菜单绝对定位、增加它的z-index,并将外部
navbar-absolute
的类:<div class="navbar navbar-fixed-top navbar-absolute">...</div>
还有几个CSS规则:
@media (max-width: 979px) {
.navbar-fixed-top.navbar-absolute {
position: absolute;
margin: 0;
}
}
.navbar-absolute + div {
margin-top: 68px;
}
这应该可以让你开始了。
如果您想让导航栏固定在页面的顶部,只需添加"class=navbar-fixed-top"即可,它会自动覆盖所有其他内容。
<nav class="navbar navbar-default navbar-fixed-top">
我结合两个答案的方法来使其工作。使用检查元素确定您的导航栏高度(除非您知道高度)。将下一个 div 的上边距设置为该数字。然后将您的导航栏设置为 navbar-fixed-top。