Как изменить самозагрузки панели колонтитула цвета

У меня есть панель начальной загрузки, и я хочу, чтобы изменить цвет нижнего колонтитула, как его заголовок. Я добавил panel-primary рядом с panel-footer класса, но только верхний контур цветом, который изменяется в основной цвет. Итак, как я могу изменить цвет нижнего колонтитула панели?Как изменить самозагрузки панели колонтитула цвета

код:

<div class="panel panel-primary"> 
    <div class="panel-heading">     
      Panel Heading 
    </div><!--.panel-heading--> 

    <div class="panel-body"> 
      Panel Body 
    </div><!--.panel-body--> 

    <div class="panel-footer panel-primary"> 
      Panel Footer 
     </div><!--.panel-footer--> 
</div>

источник

2015-10-13 Bayu Anggara

Обратите внимание, что цвет фона для заголовка устанавливается на '.panel-heading' ** не **' .panel-primary'. – misterManSam

Вы должны создать пользовательский класс, чтобы применить к классу панельного колонтитула:

Обратите внимание, что панель колонтитулы делать не INHERIT цвета и границы при использовании контекстных вариантов, поскольку они не предназначены, чтобы быть в на переднем плане. См. docs.

.panel-footer.panel-custom { 
 
    background: red; 
 
    color: white; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="panel panel-primary"> 
 
    <div class="panel-heading">Panel Heading</div> 
 
    <!--.panel-heading--> 
 
    <div class="panel-body">Panel Body</div> 
 
    <!--.panel-body--> 
 
    <div class="panel-footer panel-custom">Panel Footer</div> 
 
    <!--.panel-footer--> 
 
</div>

источник

2015-10-13 22:47:03 vanburen

Может быть, вы можете показать CSS для этих панелей?

Это, вероятно, потому, что другой CSS тег имеет более высокий приоритет над «панелью первичной» меткой. Вы можете попробовать использовать инструмент веб-разработки в Firefox/Chrome, чтобы показать, что его переписывает.

источник

2015-10-13 22:46:04 kainr2

Вы должны изменить правильную CSS, чтобы достичь этого.

Значения по умолчанию для Bootatrap 3 являются:

.panel-footer { 
    padding: 10px 15px; 
    background-color: #f5f5f5; 
    border-top: 1px solid #ddd; 
    border-bottom-right-radius: 3px; 
    border-bottom-left-radius: 3px; 
}

Вы можете переопределить эти стили (вы не должны добавлять panel-primary класс panel-footer, из-за структуры Bootstrap CSS).

источник

2015-10-13 22:50:20 makshh

Проверьте это:

CSS

.panel-footer{ 
    background-color:#337ab7; 
    border-color: #337ab7; 
    color: #FFFFFF; 

}

Я переопределить самозагрузки CSS, но это не является хорошим решением. Лучше всего объявить свой собственный класс и изменить цвета.

jsfiddle

источник

2015-10-13 22:52:13

Как изменить самозагрузки панели колонтитула цвета

ответ

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