Bootstrap navbar - ne peut pas changer la couleur de la police

Pour une raison que je ne peux pas modifier la police la couleur de mes Bootstrap navbar - il ne cesse d'apparaître en bleu. J'ai essayé de changer la couleur de fond de la barre de navigation, mais avec le même résultat. C'était OK (blanc) jusqu'à ce que j'ai défini la couleur de fond "transparent" pour la barre de navigation de regarder la façon dont je le voulais, mais j'ai pensé qu'il ne sera pas un problème pour le changer plus tard si je n'ai pas attention à elle. Merci pour votre réponse.

CSS 

.navbar {

position:absolute;
top:25px;
z-index:10;
width:100%;
background-color: transparent;
padding-right: 20px;
font-family: 'Droid Sans', sans-serif;
font-size: 17px; 
color: white;
}

HTML

<div class="bannerContainer">
<nav class="navbar">
  <div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
    <span class="sr-only">Toggle navigation</span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
  </button>
  <a class="navbar-brand">Brand</a>
</div>    
<div class="navbar-collapse collapse">
  <ul class="nav navbar-nav navbar-right">
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<b class="caret"></b></a>
      <ul class="dropdown-menu">
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
          </ul>
        </li>
    <li><a href="#">Link</a></li>
  </ul>
</div><!--/.nav-collapse -->
</nav>

OriginalL'auteur Michael_L | 2014-07-22

  1. 7

    C'est parce que cette règle :

    a {
    color: #428bca;
    text-decoration: none;
}

    De le remplacer, utilisez ce CSS :

    .navbar a {
    color: white;
}
    Merci ! C'est exactement ce dont j'avais besoin.
    color: white !important; - Ce qui est probablement nécessaire.
    Si vous utilisez !important, vous le faites mal.

    OriginalL'auteur zessx

  2. 3

    Essayer avec !important

    color: white !important;
    Ne fonctionne toujours pas
    ce sélecteur doit travailler .navbar-nav>li>une
    Merci pour l'effort !
    a fonctionné pour moi 🙂

    OriginalL'auteur neno

  3. 3

    Vous avez besoin pour utiliser cette propriété

    .navbar-nav>li>a {
 color : //desired color here
}

    dans le cas de l'inverse de la barre de navigation

    .navbar-inverse .navbar-nav > li > a {
  color : //desired color here
}
    Merci, celui-ci fonctionne de la même manière. Maintenant, je sais où j'ai fait l'erreur

    OriginalL'auteur BK004

  4. 1

    Conseils pour utiliser le bootstrap est toujours bon de bien préciser dans votre CSS.
    par exemple la couleur de votre police, vous pouvez le modifier directement 

    a{
  color: white 
}

    mais il ya des cas que la spécificité de Bootstrap est plus élevé et ne vous laisse pas le changer, même si vous mettez "!important". Dans ce cas, il est préférable d'attaquer le "un", où il est relativement
    Par exemple. 

    .navbar a{
  color: white 
}

    OriginalL'auteur elmauro