Hvordan skriver man :hover-tilstand for a:before og a:after?

Det afhænger af, hvad du egentlig forsøger at gøre.

Hvis du blot ønsker at anvende stilarter på et pseudo-element :before, når a-elementet passer til en pseudo-klasse, skal du skrive a:hover:before eller a:visited:before i stedet. Bemærk, at pseudo-elementet kommer efter pseudo-klassen (og faktisk helt til sidst i hele selektoren). Bemærk også, at det er to forskellige ting; at kalde dem begge "pseudo-selectors" vil forvirre dig, når du støder på syntaksproblemer som dette.

Hvis du skriver CSS3, kan du betegne et pseudo-element med dobbelt kolon for at gøre denne skelnen tydeligere. Derfor a:hover::before og a:visited::before. Men hvis du udvikler til ældre browsere som IE8 og ældre, kan du sagtens slippe af sted med at bruge enkelt kolon.

Denne specifikke rækkefølge af pseudoklasser og pseudoelementer er angivet i [spec] (http://www.w3.org/TR/selectors/#selector-syntax):

Et pseudo-element kan tilføjes til den sidste sekvens af simple selektorer i en selector.

En sekvens af simple selektorer er en kæde af simple selektorer, der ikke er adskilt af en kombinator. Den begynder altid med en typeselektor eller en universel selektor. Ingen anden typevælger eller universalvælger er tilladt i sekvensen.

En impel selektor er enten en typevælger, universalvælger, attributvælger, klassevælger, ID-selektor eller pseudoklasse.

En pseudoklasse er en simpel selector. Et pseudo-element er det derimod ikke, selv om det ligner en simpel selector.

Men for pseudoklasser med brugerhandlinger som f.eks. :hover1 hvis du har brug for, at denne effekt kun skal gælde, når brugeren interagerer med selve pseudo-elementet, men ikke a-elementet, så er det ikke muligt på anden måde end gennem en uklar layout-afhængig løsning. Som det fremgår af teksten, kan standard CSS-pseudo-elementer i øjeblikket ikke have pseudoklasser. I så fald skal du anvende :hover på et egentligt underelement i stedet for et pseudo-element.

1 Dette gælder naturligvis ikke for link-pseudoklasser som :visited som i spørgsmålet, da pseudo-elementer ikke er links.

Skriv a:hover::before i stedet for a::before:hover: [eksempel](http://jsfiddle.net/sandeep/PJspQ/1/).

Sådan ændrer du teksten på menulinjen ved mouseover. (Forskellige sprogtekster ved hover) her er den

[jsfiddle eksempel][1]

html:

<a align="center" href="#"><span>kannada</span></a>

css:

span {
    font-size:12px;
}
a {
    color:green;
}
a:hover span {
    display:none;
}
a:hover:before {
    color:red;
    font-size:24px;
    content:"ಕನ್ನಡ";
}