Question

我正在使用bootstrap来设计我的网站。

基于此fiddle

我将nav-static-top固定在最顶层。现在nav-collapse有很多内容，我无法浏览到最后一个菜单，因为nav-static-top已固定在最顶层。有没有办法 nav-static-top固定在最顶层，nav-collapse内容可滚动，因此我可以滚动选择内容？

我比this之类的东西，但我看起来不太好我认为Android设备不支持overflow:scroll

Answer 1

找到了更好的方法。仅在iphone 4上测试过。

@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; 
    }

}

Answer 2

这并不能完全解决您的问题，但如果您这样做肯定会更好：

<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或其他东西。

Bootstrap：固定nav-static-top在顶部但可滚动的nav-collapse

2 个答案: