Change navbar text color Bootstrap

Question

I currently have this piece of html which represents the relevant part of my navbar:

    <         


        

Answer 1

Make it the following:

.nav.navbar-nav.navbar-right li a {
    color: blue;
}

The above will target the specific links, which is what you want, versus styling the entire list blue, which is what you were initially doing. Here is a JsFiddle.

The other way would be creating another class and implementing it like so:

HTML

<li><a href="#" class="color-me"><span class="glyphicon glyphicon-list-alt"></span> R&eacute;sum&eacute;</a></li>

CSS

.color-me{
    color:blue;
}

Also demonstrated in this JsFiddle

Answer 2

For changing the text color in navbar you can use inline css as;

<a style="color: #3c6afc" href="#">

Answer 3

As of bootstrap 4, the answer is to simply set navbar-dark in the nav element, which will set the text and links to a light theme .

<nav class="navbar navbar-dark">

Answer 4

this code will work ,

.navbar .navbar-nav > li .navbar-item ,
.navbar .navbar-brand{
                       color: red;
                      }

paste in your css and run if you have a element below