Change color of bootstrap navbar on hover link?

I want to know how to change the color of the links when you hover over them in the nav bar, as currently they are an ugly color.

Thanks for any suggestions?

HTML:

<div class="container">
    <div class="navbar">
        <div class="navbar-inner">
            <ul class="nav">
                <li class="active"><a href="#">Home</a></li>
                <li><a href="#">Link One</a></li>
                <li><a href="#">Link Two</a></li>
                <li><a href="#">Link Three</a></li>
            </ul>
        </div>
    </div>
</div>

---

对于Bootstrap 3，这是我基于默认的Navbar结构做到的：

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
    background-color: #FFFF00;
    color: #FFC0CB;
}

---

This is cleaner:

ul.nav a:hover { color: #fff !important; }

There's no need to get more specific than this. Unfortunately, the !important is necessary in this instance.

I also added :focus and :active to the same declaration for accessibility reasons and for smartphone/tablet/touchscreen users.

---

您可以尝试更改悬停时的链接背景

.nav > li > a:hover{
    background-color:#FCC;
}

链接地址: http://www.djcxy.com/p/89442.html

上一篇: 更改引导程序的导航栏背景颜色和字体颜色

下一篇: 在悬停链接上更改bootstrap导航栏的颜色？