在懸停時更改鏈接顏色

Question

對於導航欄中的鏈接在懸停時我需要提供藍色但不起作用。 相反，它顯示白色。

如何解決這個問題？

在下面提供我的代碼。

http://jsfiddle.net/7HzPd/

http://jsfiddle.net/7HzPd/embedded/result/

<div class="container">
    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </a>
    <a class="brand" href="#">
        <img alt="change" class="defieLogo" src="http://www.defie.co/designerImages/defie_logo_only.png">
    </a>
    <div class="nav-collapse collapse">
        <ul class="nav">
            <li class="active">
                <a href="/docs/examples/product.html">Product</a>
            </li>
            <li>
                <a href="/docs/examples/solution.html">Solutions</a>
            </li>
            <li>
                <a href="/docs/examples/service.html">Services</a>
            </li>
            <li class="iphonePartnerLink">
                <a href="/docs/examples/partner.html">Partners</a>
            </li>
            <li class="iphoneContactLink">
                <a href="/docs/examples/contact.html">Contact</a>
            </li>
        </ul>
        <ul class="nav" id="navSecond">
            <li class="">
                <a href="/docs/examples/partners.html">Partners</a>
            </li>
            <li>
                <a href="/docs/examples/contact.html">Contact</a>
            </li>
        </ul>
        <form class="navbar-form pull-right">
            <input class="span2" type="text" placeholder="Email">
            <input class="span2" type="password" placeholder="Password">
            <button type="submit" class="btn">Sign in</button>
        </form>
    </div>
    <!--/.nav-collapse -->
</div>

Answer 1

我看到的唯一代碼是懸停在這里：

.navbar-inverse .nav .active > a:hover{
       background-color: transparent;
}
.navbar-inverse .nav .active > a:hover{
      color: #14486b;
} 

首先，你應該結合這些元素，通過你的CSS並清理一些，沒有理由將這些元素分開。

對於你的問題，這是唯一的：我看到的懸停元素，在這種情況下，你的目標是任何具有懸停狀態的錨，它也有.active類，里面是.nav類，里面是.navbar-inverse class ...你是目標：不正確地懸停，活動類一次只應用於一個鏈接。

你應該有更多的東西：

.nav li a:hover {}

編輯：

發現了罪魁禍首。

在4740行的bootstrap.css中有一個懸停狀態，它覆蓋了你的樣式。 嘗試在你放入的懸停上加上!important ，同時確保你的樣式表包含在bootstrap.css下面。 您也可以直接編輯bootstrap css。

Answer 2

這不行嗎？

a:hover
{
background-color:blue;
} 

如果您願意，只需將a更改為更具體的內容即可。