2015-04-14 5 views
1

Мне нужно изменить цвет Navbar в Yii2 (где у меня есть Home, About, ...), как я могу это сделать? Я не хочу менять тему.Как изменить цвет Navbar в Yii2

это сайт 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"> 

    .... 

Но я не знаю, где Navbar настроен. Я пробовал редактировать все файлы bootstrap.css (navbar), но ничего не изменилось.

+1

Было бы полезно, если бы вы разместили фрагменты кода. – SK2017

+0

Вам необходимо внести изменения. - Этот ответ такой расплывчатый, как ваш вопрос –

ответ

4

Если вы посмотрите в файле макета вы увидите:

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

Если удалить navbar-inverse панели Navbar BG-цвет становится белым. Если вы хотите изменить цвет на что-то еще вы можете добавить my-navbar где navbar-inverse был и добавить

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

Не изменяйте бутстраповских файлы, просто добавить или даже переписать в свой собственный CSS.

EDIT

Советов: если вы используете хром панель инструменты разработчика (или подобные) коснуться вы можете просто парите элементы и посмотреть, какой класс они стилизованы, а затем перезаписать класс в собственном CSS.

+0

Спасибо :) это здорово! – Rori

Смежные вопросы