Bootstrap:固定导航静态顶部在顶部，但可滚动导航崩溃

Bootstrap:Fixed nav-static-top on top but scrollable nav-collapse

本文关键字：导航 顶部 滚动 崩溃 静态 Bootstrap      更新时间：2023-09-26

我正在使用引导程序来设计我的网站。

基于这个小提琴

我把nav-static-top固定在上面。现在nav-collapse有很多内容，我无法浏览到最后一个菜单，因为nav-static-top固定在顶部。有没有办法nav-static-top固定在顶部，nav-collapse内容是可滚动的，所以我可以滚动选择内容？

我有过这样的经历，但我看起来不太好我认为android设备不支持overflow:scroll

找到了更好的方法。仅在iphone4上测试。

@media (max-width: 767px) { 
.body-container {
    padding-top: 50px;
    margin-left:10px;
    margin-right:10px; 
}
.navbar-static-top{
    position:fixed;
    width:100%;
    z-index:1000;
}
.navbar-responsive-collapse{
    max-height: 350px;  
        overflow-y: auto; 
        -webkit-overflow-scrolling: touch; 
    }
}

这并不能完全解决你的问题，但如果你这样做，它看起来肯定会更好：

<div class="nav-collapse collapse navbar-responsive-collapse" style="overflow-y: scroll;max-height:400px">
<ul class="nav">

而不是

<div class="nav-collapse collapse navbar-responsive-collapse">
<ul class="nav" style="overflow: scroll;max-height:400px">

我不知道在Android上做这件事，但如果真的不能这样做，你可能需要写一些JS之类的东西。

相关文章：