Изменение цвета текста на панели навигации

Question

У меня есть панель навигации с указанным c цветом, и на моей панели навигации есть выпадающее меню, я хотел бы изменить цвет текста в раскрывающемся меню, потому что теперь он такой же, как и панель навигации. Как я могу сделать это с CSS?

 <nav class="navbar navbar-expand-lg" style="background-color: #001997;">
          <a class="navbar-brand" href="images//graph.png"></a>
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>

            <div class="collapse navbar-collapse" id="navbarNavDropdown">
                <ul class="navbar-nav">
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="https://bootstrapthemes.co" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            Charts  
                        </a>

CSS

.navbar.navbar-expand-lg { 
background-color:#233cb9;}

Answer 1

Вероятно, я неправильно объясняю себя, я нашел решение в "выпадающем-переключателе nav-link" CSS:

.nav-link.dropdown-toggle {
color: black;}

Это то, что мне было нужно. Еще спасибо всем, кто подсказывает путь!

Answer 2

Вы можете добавить это к вашему CSS:

.navbar.navbar-expand-lg > #navbarNavDropdown { 
    color: #ff0000;
}

Это будет нацелено на элемент с идентификатором navbarNavDropdown, который является прямым потомком элементов с классами navbar и navbar-expand-lg.

Или вы можете выбрать классы выпадающего списка следующим образом:

.collapse.navbar-collapse {
    color: #ff0000;
}

Answer 3

 li .dropdown{
   background-color:#233cb9;
}

или

.navbar-collapse li .dropdown  {
    background-color: color;
}

Answer 4

Использование

.navbar-collapse {
    color: /* whatever color you want */;
}