-1

世界中のすべてのリンクにこれらのスタイルがあります。同じページの div でリンク スタイルをオーバーライドできません。

a, a:visited{
    outline: 0;
    cursor: pointer;
    color: inherit;
    text-decoration: none;
}

a:hover{
    text-decoration: underline;
}

ここで、アンカー リンクのスタイルをオーバーライドして、ホバー時に色を白に変更したいと考えていますが、このような複数のクラスの目に見えない div と通知コンテナーでのみ...

<div class="unseen notificationContainer">                     
    <a href="profile?customerId=1365764036258">
        <strong>robert</strong>
    </a>
    sent you a friend request 
    <a href="friend_request?type=accept&amp;notificationId=1365764054463">
        Accept
    </a>
    <a href="friend_request?type=reject&amp;notificationId=1365764054463">
        Reject
    </a>          
</div>

だから私は私のCSSに以下を追加します

.unseen{
    background: #09f;
    color: #fff;
}

.unseen a :hover{
    color: #fff;
    text-decoration: underline;
}

ページが読み込まれると、最初のリンクにカーソルを合わせると色が白に変わりますが、他の 3 つのリンクは背景色が青になります。私はこれを過去1時間続けていますが、ただイライラするだけではありません. notificationContainer のスタイルは次のとおりです。

.notificationContainer{
    width: 390px;
    float: left;
    border-bottom: solid 1px #eee;
    padding: 5px;
}

前もって感謝します。

4

2 に答える 2

7

CSS にバグがある可能性はありません。ブラウザだけにバグがある可能性があります (CSS 仕様のエラーなどを意味しない限り)。

つまり、これはコードのバグであり、ブラウザのバグではありません。

.unseen a :hover{
    color: #fff;
    text-decoration: underline;
}

との間のスペースはと内aの要素を意味し、 内の要素を意味するのと同じように機能しません。そのスペースを削除する必要があります。:hover:hover a.unseen aa.unseen

.unseen a:hover{
    color: #fff;
    text-decoration: underline;
}
于 2013-04-12T12:27:21.753 に答える
0

あなたが何を求めているのかよくわかりません - あなたの質問は本当に明確ではありません。見当違いでしたらご容赦を。これは役に立ちますか？(複数のクラスを持つ要素をターゲットにすることができます)

<style>
a, a:visited{
outline: 0;
cursor: pointer;
color: inherit;
text-decoration: none;
}

a:hover{
    text-decoration: underline;
}

.unseen.notificationContainer a:hover
{
    background: #09f;
    color: #fff;
    text-decoration: underline;
}
.notificationContainer
{
    display: inline-block;
    float: left;
    border-bottom: solid 1px #eee;
    padding: 5px;
}
</style>

と

<div class="unseen notificationContainer">                     
    <a href="profile?customerId=1365764036258"><strong>robert</strong></a>
    sent you a friend request 
    <a href="friend_request?type=accept&amp;notificationId=1365764054463">Accept</a>
    <a href="friend_request?type=reject&amp;notificationId=1365764054463">Reject</a>          
</div>
于 2013-04-12T12:43:46.743 に答える