3

丸薬のロールオーバーの色とアクティブな丸薬の色を変更したいと思います。私のhtmlは次のようになります：

 <div class="theme">
    <div class="banner">
        <h1>Sandstorm</h1>
        <ul class="nav nav-pills red">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Events</a></li>
            <li><a href="#">Contact</a></li>
        </ul>
    </div>
</div>

そして私のCSSは次のようになります：

.red .active a,
.red .active a:hover {
    background-color:red;
}

でも色は落ちません。私は何が欠けていますか？

(フォントも変更したいのですが... 野心的すぎるかもしれません。)

4

1 に答える 1

0

次のように CSS を変更します。

CSS

.red .active a,
.red .active a:hover{
    background:red !important;
}
.red a:hover {
     background: red !important;
    color:white;
}

変更したい正確なアイテムをターゲットにしていることを確認してください。アクティブなピルのみを赤くしたい場合は、次の CSS をコメントアウトして、ホバーの色効果を取り除いてください。

.red a:hover {
     background: red !important;
    color:white;
}

デモ JSFiddle

于 2014-07-13T19:58:52.707 に答える