スタイルシートで

質問

外部スタイルシートのみでリンクの上にマウスが乗ったら背景の色が変わるようにしているのですが、

a:link {background-color: #FFFFFF;}

a:hover {background-color: #000000;}

a:visited {background-color: #FFFFFF;}

この場合、一度リンクしたら次にマウスが乗っても変化しません。外部スタイルシートのみでうまくいく方法はあるのでしょうか？

よろしくお願いします。

回答No.2

kalze · ベストアンサー

hoverとvisitedの定義順を逆にする。

a:link {background-color: #FFFFFF;}
a:visited {background-color: #FFFFFF;}
a:hover {background-color: #000000;}

一度訪問すると、その後はvisitedであるかどうかという条件は真になりますよね？
その状態で、カーソルを合わせると、hoverであるかどうかという条件も真になる。

となるとどちらの優先順位を高くするか？になります。
CSSで同じように定義した場合（つまり、インラインなど使用方法で優先度が変わるような使い方をせずに、同等の優先順位になる使い方をした場合）、下で定義されている方が優先度が高くなるので、hoverを後で定義することで、hoverの方が優先され、ご希望の動作になるかとおもいます。

動作確認
IE6
NN7.1
Opera7.22

お礼

ありがとうございます、順番を変えたら無事に動作しました（＾＾；）

回答No.1

noname#107580

こんにちは！

今時間がなく、確認していませんが

a:link を a にしてみて下さい。

＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋

a {background-color: #FFFFFF;}

a:hover {background-color: #000000;}

a:visited {background-color: #FFFFFF;}

+＋＋＋＋＋＋＋＋＋＋＋＋＋＋

お礼

ありがとうございます、順番を変えたら無事に動作しました（＾＾；）