html - CSS-a：visited：hover？

Question

colorすでにマウスを使用してvisitedいるハイパーリンクにのみフォントを適用するにはどうすればよいですか？hover

基本的に、私がやりたいのは

a:visited:hover {color: red}

Answer 1

はい、それは可能です。

次に例を示します。

<style type="text/css">
    a:link:hover {background-color:red}
    a:visited:hover {background-color:blue}
</style>

<a href="http://www.google.com/">foo</a><a href="http://invalid/">bar</a>

Answer 2

前述のように、これが正しく機能するためのcss宣言順序がありますが、この特定のオプションについては説明していませんが、違いはあります。Chromeでこれをテストしました。

注文は

    a:link { color: red; }
    a:visited { color: blue; }
    a:visited:hover { color: yellow; }
    a:hover { color: green; }
    a:active { color: gray; }

a：hoverとa：visited：hoverの両方がa：visitedの後、a：activeの前である限り、a：hoverの前でも後でも機能します。私は、訪問した2つのリンクを一緒に保ち、2つのホバーを一緒に保つことを好みます。

Answer 3

リンクcssの間にシーケンスがあります。a：hoverはa：linkとa：visitedの後に来る必要があり、a：activeはa：hoverの後に来る必要があります。詳細については以下のリンクを参照してください。

http://www.w3schools.com/css/css_pseudo_classes.asp

Answer 4

FWIW、（Chrome / FF）の背景を宣言せずに、（Chrome / FF）でcolorスタイリングすることはできませんでした（他の何か、または機能しているようです、私はアルファのために使用しました）。a:visited:hover:link:hovernoneinheritrgba()

これをChrome/FFで機能させるには：

a:visited:hover {
    color: #f00;
}

...（のような）これは存在する必要があります：

a:link:hover {
    background-color: rgba(255, 255, 255, 0);
}