如何更改Yii2中的导航栏颜色

Question

我需要更改Yii2中导航栏的颜色（我拥有Home，About，...）我该怎么做？我不想改变主题。

这是网站的CSS文件：

html, 
body { 
    height: 100%; 

} 

.wrap { 
    min-height: 100%; 
    height: auto; 
    margin: 0 auto -60px; 
    padding: 0 0 60px; 
} 

.wrap > .container { 
    padding: 70px 15px 20px; 
} 

.footer { 
    height: 60px; 
    background-color: #B0C4DE; 
    border-top: 1px solid #ddd; 
    padding-top: 20px; 
} 

.jumbotron { 
    text-align: center; 
    background-color: transparent; 
} 

.jumbotron .btn { 
    font-size: 21px; 
    padding: 14px 24px; 
} 

.not-set { 
    color: #c55; 
    font-style: italic; 
} 

/* add sorting icons to gridview sort links */ 
a.asc:after, a.desc:after { 
    position: relative; 
    top: 1px; 
    display: inline-block; 
    font-family: 'Glyphicons Halflings'; 
    font-style: normal; 
    font-weight: normal; 
    line-height: 1; 
    padding-left: 5px; 
} 

a.asc:after { 
    content: /*"\e113"*/ "\e151"; 
} 

a.desc:after { 
    content: /*"\e114"*/ "\e152"; 
} 

.sort-numerical a.asc:after { 
    content: "\e153"; 
} 

.sort-numerical a.desc:after { 
    content: "\e154"; 
} 

.sort-ordinal a.asc:after { 
    content: "\e155"; 
} 

.sort-ordinal a.desc:after { 
    content: "\e156"; 
} 

.grid-view th { 
    white-space: nowrap; 
} 

.hint-block { 
    display: block; 
    margin-top: 5px; 
    color: #999; 
} 

.error-summary { 
    color: #a94442; 
    background: #fdf7f7; 
    border-left: 3px solid #eed3d7; 
    padding: 10px 20px; 
    margin: 0 0 15px 0; 
} 

，这是该网站视图（的index.php）：

<?php 
/* @var $this yii\web\View */ 
$this->title = 'ACME Database'; 
?> 



<div class="site-index"> 

    <div class="jumbotron"> 
     <h1>Welcome to ACME Database!</h1> 


    </div> 

    <div class="body-content"> 

    .... 

但我不知道那里的导航栏配置。我尝试编辑所有bootstrap.css文件（导航栏），但没有任何更改。

Answer 1

如果你在你的布局文件一看，你会看到：

NavBar::begin([ 
      ... 
      'options' => [ 
       'class' => 'navbar-inverse navbar-fixed-top', 
      ], 
     ]); 
    ... 

如果删除navbar-inverse导航栏BG-颜色变白。如果你想改变颜色为别的东西，你可以添加my-navbar其中navbar-inverse是添加

.my-navbar { 
    background-color: #yourcolor; 
} 

不要更改引导文件，只需添加，甚至在自己的CSS覆盖。

编辑

温馨提示：如果您使用Chrome开发者工具栏（或类似的成才），你能够悬停的元素，看看它们类与风格，然后覆盖在自己的CSS类。