0

CSS 疑似クラス a:hover、a:visited、および a:active が機能しない

HTML:

<p> 
    <ul>
        <li>
            <a href="ChrisHorse.jpg" class="Horse"> My Photoshop Assignment #1       </a>
        </li>
        <li>
            <a href="puppies.html"> My puppies page </a>
        </li>
        <li>
            <a href="fish.html"> My Fish Page </a>
        </li>
    </ul>
</p>

CSS:

a:hover {color:green;}
a:visited {color:red;}
a:active {color:black;}
4

3 に答える 3

3

CSS の正しい順序は次のとおりです。

a:link    { color: red }    /* unvisited links */
a:visited { color: blue }   /* visited links   */
a:hover   { color: yellow } /* user hovers     */
a:active  { color: lime }   /* active links    */
于 2013-10-24T14:50:15.577 に答える
1

jsfiddleからコードをテストしました。順調です。css ファイルを html ファイルに含めるのを忘れている可能性があります。

したがって、次の指示からそれを含めるだけです。

<link rel="stylesheet" type="text/css" href="mystyle.css">
于 2013-10-24T14:52:35.273 に答える
0

ここで問題が であると仮定すると、問題はセレクターをセレクターの前に:hover配置していることです。これは、リンクがアクセスされると、ホバー スタイルがなくなることを意味します (アクセスされたスタイルによって上書きされるため)。 . セレクターの順序を変更するだけです。:hover:visited

a:visited {color:red;}
a:hover {color:green;}
a:active {color:black;}

これにより、リンクが訪問されると赤になります。リンクにカーソルを合わせると、アクセスしたかどうかに関係なく緑色になります。リンクがアクティブになると、黒になります。

JSFiddle デモ。

于 2013-10-24T14:52:25.707 に答える