如何更改<a>anchor link in bootstrap&#39;s navbar-inverse class

时间:2017-07-06 17:10:43

标签: html twitter-bootstrap navbar

Here's the problem that i'm facing, the color of anchor link in the navbar-inverse class by default is set to a greyish color.
When i make changes in the css, im only able to target the link color when it is active or in focus or when hovered.
The moment i click outside (the link goes out of focus) it changes back to grey.

    .navbar-inverse .navbar-nav > .active > a,
    .navbar-inverse .navbar-nav > .active > a:hover,
    .navbar-inverse .navbar-nav > .active > a:focus
    {
        background:  aquamarine;
        color: white ;

            }

How do i specifically target color attribute of the anchor element when its not active in the navbar ?.

1 个答案:

答案 0 :(得分:1)

问题在于您正在使用活动类指定锚标记,但是锚可能没有活动类,因此您将其视为灰色。

前两个区块定位的锚<a>标记没有.active类。你问题中的最后一个与.active类基本相同。

.navbar-inverse .navbar-nav > li > a {
    color: #fff;
}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
    color: #fff;
}
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {
    color: #fff;
    background: aquamarine;
}