- ベストアンサー
CSS：リンクにカーソルを合わせたときに文字の色が変わらない
CSSでリンクする文字をカーソルが上に乗ったとき、文字の色を赤、下線を無くすようにしようと思ったのですが、下線部は消えるのですが文字が赤くなりません。 これを解決する方法はないでしょうか？ a:hover {color: red; text-decoration: none} 回答よろしくお願いします。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
関係ないかもしれませんが、a要素の疑似クラスは順番通りに書かないとブラウザによっては反映されないことがあります。 順番 a:link{ } a:visited{ } a:hover{ } a:active{ } 例えばa:hoverがa:visitedの前に来たり、順番が前後してないか注意。
その他の回答 (2)
再現してみましたが、きちんと「下線は無く文字は赤」で表示されますね。 他に何かCSSを記述されていませんか？
お礼
回答ありがとうございます。 どうやら記述の順番に問題があったようです。 最初は、 1.a:link 2.a:hover 3.a:visited の順番で記述してうまくいきませんでした。 それを、 1.a:link 2.a:visited 3.a:hover の順番に直したところ文字が赤くすることができました。 ありがとうございました。
- gizmo_s
- ベストアンサー率50% (3/6)
記述は間違っていませんし、 問題なく赤色で、下線も消えます。 正しくCSSがページにリンクされていないのでは？ ヘッダー情報はどのように指定してあるのでしょうか？
お礼
回答ありがとうございます。 どうやら記述の順番に問題があったようです。 最初は、 1.a:link 2.a:hover 3.a:visited の順番で記述してうまくいきませんでした。 それを、 1.a:link 2.a:visited 3.a:hover の順番に直したところ文字が赤くすることができました。 ありがとうございました。
補足
回答ありがとうございます。 <head>の間には、 <link rel="stylesheet" href="Link.css" type="text/css" /> と記述しています。読み込むスタイルシートは「Link.css」で合ってるはずなんですが…。
お礼
Muller3さんのおっしゃるとおり「a:visited」と「a:hover」の順番が間違っていました。 順番を直したところ文字が赤くなり正常に動作しました。 ありがとうございました。