如何使我的导航栏在 Twitter 引导程序上无响应答案

【问题标题】：How do I make my navigation bar non-responsive on Twitter bootstrap如何使我的导航栏在 Twitter 引导程序上无响应
【发布时间】：2015-05-09 01:06:28
【问题描述】：

我目前正在使用 Twitter Bootstrap 设计一个网页，在我的页面上，我想要一个附加到页面顶部的导航栏，当页面宽度减小时会折叠，第二个导航栏固定在页面缩小时不会折叠的页面底部，因为它上面只会有一些社交媒体图标。

问题是我希望顶部导航栏响应而底部导航栏不响应。

这是否可能在使用 Bootstrap 3 时，我目前对底部导航栏的了解如下：

<div class = "navbar navbar-inverse navbar-fixed-bottom">
    <div class = "container">
        <ul class = "nav navbar-nav navbar-right">
            <li><a href = "#">Home</a></li>
            <li><a href = "#">Blog</a></li>
            <li><a href = "#">Contact Us</a></li>
            <li><a href = "#">About</a></li>
        </ul>
    </div>
</div>

【问题讨论】：

如果您在网站上的任何地方都没有使用响应式，您可以下载自定义构建的 Bootstrap，而无需 getbootstrap.com/customize 的响应式

标签： html css twitter-bootstrap

【解决方案1】：

只需从您的无序列表中删除navbar-nav 并将display:inline-block 添加到您的列表项中，如下所示：

HTML：

<div class = "navbar navbar-inverse navbar-fixed-bottom">
    <div class = "container">
        <ul class = "nav navBot">
            <li><a href = "#">Home</a></li>
            <li><a href = "#">Blog</a></li>
            <li><a href = "#">Contact Us</a></li>
            <li><a href = "#">About</a></li>
        </ul>
    </div>
</div>

CSS：

.navBot li  {
    display:inline-block;    
}

这是一个带有上述代码的 jsfiddle：https://jsfiddle.net/AndrewL32/e0d8my79/41/

【讨论】：

【解决方案2】：

另一种使导航栏无响应的方法是给.navbar 固定宽度，如600px。

【讨论】：