1

CSSでナビゲーションメニューを作成しました。アイテム（LI）がactiveホバー可能になるのを防ぐ方法である場合はどうなりますか？

以下のCSS：

.page-header .menu li {
    float:left;
    display: inline;
    margin-right: 2px;
    line-height: 34px;
} 

.page-header .menu li a.active {
    background-color: white;
    font-weight: bold;
    color:black;
}

.page-header .menu li a:hover {
    background-color: red;
}

HTML：

    <ul class="menu">
        <li><a class="active" href="">Item 1</a></li>
        <li><a href="">Item 2</a></li>
        <li><a href="">Item 3</a></li>
    </ul>

-

class="active"ホバーを禁止する必要があります。

4

1 に答える 1

4

それを選択してください：

.page-header .menu li a.active,
.page-header .menu li a.active:hover {
    background-color: white;
    font-weight: bold;
    color:black;
}

http://jsfiddle.net/userdude/RSwnP/

を追加しましたが、セレクターの特異性がここでオーバーライドしていることにa.active:hoverも注意してください。私が一方を他方よりも「具体性が低い」ものにした例（使用したいかどうかはわかりません）については、このフィドルを参照してください。セレクターからを削除しました。li:hover

于 2012-08-14T23:07:31.850 に答える