更改BootStrap导航栏上的默认设置

我一直在尝试更改导航栏上的背景颜色等。发现 Change navbar color in Twitter Bootstrap 3 所以我复制它，改变了颜色的其他地方一个例子，我的CSS是这样的：如果我使用更改BootStrap导航栏上的默认设置

.navbar-actions { 
    background-color:#0099cc; 
    color:#ff6600; 
    border-radius:0; 
} 

.navbar-actions .navbar-nav > li > a { 
    color:#ff6600; 
} 
.navbar-actions .navbar-nav > .active > a, .navbar-nav > .active > a:hover, .navbar-nav > .active > a:focus { 
    color: #ff6600; 
    background-color:transparent; 
} 
.navbar-actions .navbar-brand { 
    color:#ff6600; 
}

我的代码工作正常，导航栏，默认情况下它正确地崩溃，并显示按钮展开。当我切换到navbar-actions时，导航器没有颜色，当它折叠时没有展开按钮。这里是我的导航器的代码：

<nav class='navbar navbar-actions'> 
        <div class="container-fluid"> 
         <div class='navbar-header'> 
          <button type='button' class='navbar-toggle' data-toggle='collapse' 
           data-target='#viewNavbar'> 
           <span class='icon-bar'></span> 
           <span class='icon-bar'></span> 
           <span class='icon-bar'></span> 
          </button> 
          <div class='hidden-sm hidden-md hidden-lg'> 
           <a class="navbar-brand">Actions</a> 
          </div> 
         </div><!-- navbar-header --> 
         <div class='collapse navbar-collapse' id='viewNavbar'> 
          <ul class="nav nav-pills"> 
           <li role="presentation"> 
            Action One 
           </li> 
           <li role='presentation'> 
            Action Two 
           </li> 
           <li role='presentation'> 
            Action Three 
           </li> 
          </ul> 
         </div><!-- collapse --> 
        </div><!-- container --> 

       </nav>

我只是真的进入引导格式，所以任何帮助将不胜感激。

来源

2016-03-05 Bill F

.navbar-weather { 
    background-color: #336699; 
    color:#eee; 
    border-radius:0; 
} 

.navbar-weather .navbar-nav > li > a { 
    color:#dcdcdc; 
    padding-left:20px; 
    padding-right:20px; 
} 

.navbar-weather .navbar-nav > .active > a, .navbar-nav > .active >  a:hover, .navbar-nav > .active > a:focus { 
    color: #B0C4DE; 
    background-color: transparent; 
} 

.navbar-weather .navbar-nav > li > a:hover, .nav > li > a:focus { 
    text-decoration: none; 
    color: #000; 
    background-color: #B0C4DE; 
} 

.navbar-weather .navbar-brand { 
    color :#eee; 
} 

.navbar-weather .navbar-toggle { 
    color: #eee 
    background-color: transparent; 
} 

.navbar-weather .icon-bar { 
    background-color: #dcdcdc; 
}

这里（而不是使用导航栏 - 行动）就是我用我的weathersite

来源

2016-03-06 02:57:57

这似乎已经做到了，但不明白为什么我原来的那个不行。任何它正在做我想做的事情，所以我会继续前进。谢谢 –

在这种情况下，只需重写.navbar-default类时是否存在任何问题？

来源

2016-03-05 21:37:44 Cdok

不能完全确定你的意思是什么压倒一切的导航栏，你可以给一个为实例？ –

如果navbar默认类正在工作，请继续使用

我修改了我的css并添加了您的示例（删除其他内容只是为了确保）导航栏以默认背景和其他格式显示。 –

更改BootStrap导航栏上的默认设置

回答

相关问题