Can't change nav-bar link's color in Bootstrap 4

问题

I am trying to change nav bar's one link's color while I tried all ways it still has a default color. Here is the code:

<li class="nav-item signup">
        <a class="nav-link" routerLink="/signup" >Sign Up</a>
      </li>

css

.navbar-light .navbar-nav .nav-link li a.signup {
    color:#ffffff !important;
}

I am trying to change sign up buttons link color. An interesting fact is that the background color of nav-item (.signup class) was possible to change while a link is impossible.

How can I change that a link color? What is wrong on the css?

回答1:

Your anchor has .nav-link class, your .nav-item has the custom .signup class. Where did you come up the structure of .nav-link li a.signup?

Try this:

.navbar-light .navbar-nav .nav-item.signup .nav-link {
    color:#fff;
}

来源：https://stackoverflow.com/questions/51367180/cant-change-nav-bar-links-color-in-bootstrap-4