Retour automatique à l'état avant le survol et la mise au point pour les liens

Question

J'ai modifié l'apparence par défaut des liens en changeant a:hover y a:focus pour les liens relevant d'une catégorie spécifique :

.myclass > a:hover, a:focus {
    color: limegreen;
}

Tout se passe exactement comme je le souhaite, à l'exception d'un petit comportement : lorsque j'ouvre un lien dans un nouvel onglet, je constate, en revenant sur la page, que le lien sur lequel j'ai cliqué affiche toujours le style hover et focus, même si le curseur n'est pas sur le lien. Je dois cliquer ailleurs dans la fenêtre (ou même en dehors de la fenêtre du navigateur) pour le faire disparaître.

Comment puis-je faire en sorte que le texte et l'icône du lien reviennent automatiquement à leur état non focalisé après le clic en n'ayant tout simplement pas le curseur sur le lien ?

J'espère que cela peut être fait sans avoir recours à JavaScript.

P.S. J'utilise Bootstrap v. 3.3.4.

P.P.S. J'ai déjà essayé d'utiliser a:active mais cela n'a pas aidé.

Answer 1

Utilisation a:active au lieu de :focus

a:hover, a:active {
    color: limegreen;
}

<a href="#">try me</a>

Answer 2

Vous devez utiliser le :active également :

a:active, a:focus, a:hover {
  color: limegreen;
}