Подменю синего цвета при наведении курсора в bootstrap

У меня есть сайт под управлением joomla 3.0, и я пытаюсь настроить строку меню. Шаблон - protostar, и я использую стиль nav-pills, чтобы строка меню располагалась горизонтально вверху.

У меня проблема в том, что я не могу найти, где мне нужно изменить или включить css, чтобы ИЗМЕНИТЬ СИНИЙ цвет при наведении курсора в подменю.

Также я хотел бы знать, как изменить цвет этой маленькой белой стрелки в подменю.

Изображение меню, которое я хочу отредактировать


twitter-bootstrap joomla joomla3.0
person Carlos Jorge Rodriguez    schedule 05.02.2013    source источник
comment
Можете ли вы предоставить ссылку на свой сайт, чтобы элемент можно было проверить, или загрузите Firebug (для Firefox) или воспользуйтесь инструментами разработчика Chrome для самостоятельной проверки элемента.   -  person Lodder    schedule 06.02.2013

Ответы (4)


arrow_upward
1
arrow_downward

Общий совет сработал и для меня. Joomla 3.x должна использовать раздел .navigation .nav-child: hover, как указано выше. Мне также пришлось изменить раздел линий градиента, когда вызывалась одна из них. Просто изменение фоновых линий не отображалось. Я думал об их удалении, но вместо этого сделал то же самое. Предположение, что то, что используется, - это выбор на основе браузера, если вариант подходит.

person Princer800    schedule 05.01.2014

arrow_upward
0
arrow_downward

Просто зашел на сайт Bootstrap и проверил элемент, он оказался в строках с 2927 по 2934 файла bootstrap.css:

.dropdown-menu li > a:hover,
.dropdown-menu li > a:focus,
.dropdown-submenu:hover > a {
  color: #ffffff;
  text-decoration: none;
  background-color: #0081c2;
  background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
  background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
  background-image: -o-linear-gradient(top, #0088cc, #0077b3);
  background-image: linear-gradient(to bottom, #0088cc, #0077b3);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
}

background-color: #0081c2; предназначен для браузеров, несовместимых с CSS3, а все нижеприведенное - для совместимых с CSS3.

Помните, что Joomla могла что-то изменить в файле bootstrap.css, поэтому он может находиться в другой строке, однако вы можете просто искать следующее:

.dropdown-submenu:hover > a

Надеюсь это поможет

person Lodder    schedule 05.02.2013

arrow_upward
0
arrow_downward

Спасибо за Лоддера Помощи! К сожалению, это не сработало. Я обнаружил, что мне пришлось изменить не .dropdown-submenu:hover > a {, а вместо этого .navigation .nav-child:hover > a { Тем не менее, спасибо за то, что потратили время на попытки мне помочь!

person Carlos Jorge Rodriguez    schedule 06.02.2013

arrow_upward
0
arrow_downward

Была такая же проблема. Вы можете использовать этот селектор:

.navigation .nav-child li a:hover{

КЛЮЧЕВОЕ, однако, заключается в том, чтобы установить

background-image:none;

поскольку стиль по умолчанию использует градиент, а не только цвет фона!

person Derek    schedule 15.01.2016