2016-02-01 5 views
-2

Не могли бы вы рассказать мне, почему парит рядом с социальными значками, превращает их в черный? Это из-за кнопок навигации? Можно ли избавиться от этого черного зависания и сохранить только синие/красные зависания? https://jsfiddle.net/DTcHh/16537/Проблема с наведением цветов

<body> 
<nav class="navbar navbar-default navbar-fixed-top"> 
<div class="container-fluid"> 
    <div class="navbar-header"> 
    <ul class="nav navbar-nav navbar-right social"> 
     <li><a href="#"><i class="fa fa-2x fa-facebook hidden-xs"></i></a></li> 
     <li><a href="#"><i class="fa fa-2x fa-twitter hidden-xs"></i></a></li> 
     <li><a href="#"><i class="fa fa-2x fa-instagram hidden-xs"></i></a></li> 
     <li><a href="#"><i class="fa fa-2x fa-pinterest hidden-xs"></i></a></li> 
    </ul> 
    </div> 
</div> 
</nav> 
</body> 

ответ

0

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

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus { 
    color: #777; 
} 

и удалить

.navbar-default .navbar-brand:hover, 
.navbar-default .navbar-brand:focus { 
    color: #000; 
} 

https://jsfiddle.net/DTcHh/16540/

0

Хорошо, после проверки источника с помощью инструментов разработчика, я узнал, что проблема с бутстраповскими самими классами.

Например, если вы переключите состояние зависания на навигационных ссылках, то сразу же ребенок получит цвет черного. Мы должны переопределить поведение Bootstrap по умолчанию.

.navbar-default li a:hover > *, .navbar-default li a:focus > * { 
    color: #777; 
} 
Смежные вопросы