11

div にカーソルを合わせたときにリンクの色を変更するにはどうすればよいですか?

私は使用しようとしました：

#voltarTEST {
    width: 80px;
    height: 62px;
    padding-top: 16px;
    background-image: url(../img/multiLangImage/Seta11.png);
    background-repeat: no-repeat;
}
#seguinteBtn {
    width: 80px;
    height: 62px;
    padding-top: 16px;
    background-image: url(../img/multiLangImage/Seta21.png);
    background-repeat: no-repeat;
    text-decoration: none;
    color: #777;
}
#seguinteBtn:hover {
    background-image: url(../img/multiLangImage/Seta22.png);
    background-repeat: no-repeat;
    text-decoration: none;
    color: #FFF;
}
#voltarText {
/*  padding-right: 10px;*/
    padding-left: 30px;
}
#voltarNEText {
/*  padding-right: 10px;*/
    padding-left: 30px;
}
#voltarTEST:hover {
    background-image: url(../img/multiLangImage/Seta12.png);
    background-repeat: no-repeat;
}
#voltarTEST a {
    text-decoration: none;
    font-size: x-small;
    font-family: Verdana;
    text-decoration: none;
    color: #999;
}
#voltarTEST a:hover {
    text-decoration: none;
    font-size: x-small;
    font-family: Verdana;
    text-decoration: none;
    color: #FFF;
}
#dataUltimaSincMSG {
    margin-bottom: 0;
}
#estadoSinc {
    margin-bottom: 0;
}

しかし、それは機能しませんでした。これは、リンクの上にカーソルを置いたときにのみ色が変わります。

4

3 に答える 3

34

これを追加：

#voltarTEST:hover a{
    text-decoration: none;
    font-size: x-small;
    font-family: Verdana;
    text-decoration: none;
    color:#FFF;
}
于 2012-06-25T17:00:47.283 に答える
9

リンクではなく、divにホバーイベントを設定したい..

#voltarTEST a:hoverする必要があります#voltarTEST:hover a

voltarTEST最初の（あなたが持っていた方法）は、 div内のリンクがホバーされたときを示します。2 つ目は、がホバーされたvoltarTESTときに、このスタイルを内部のリンクに適用することを示しています。voltarTEST

ここにデモがあります

于 2012-06-25T17:01:44.150 に答える
2

:hoverのdiv代わりにを使用してくださいa：

#voltarTEST:hover a{
    text-decoration: none;
    font-size: x-small;
    font-family: Verdana;

    text-decoration: none;
    color:#FFF;
}
于 2012-06-25T17:00:56.537 に答える