: survol mais: pas sur une classe spécifique
Comment appliquer un effet de survol sur un élément a, mais pas sur un élément a avec la classe active?
a:hover(not: .active)
Semble quelque chose manque.
La notation fonctionnelle est sur :not(), pas :hover:
a:not(.active):hover
Si vous préférez mettre :hover d'abord, c'est bon:
a:hover:not(.active)
Peu importe la pseudo-classe qui arrive en premier ou en dernier; de toute façon, le sélecteur fonctionne de la même manière. Il se trouve que c'est ma convention personnelle pour mettre :hover last, car j’ai tendance à placer des pseudo-classes d’interaction utilisateur derrière des pseudo-classes structurelles.
Vous avez la possibilité d'utiliser le sélecteur not() .
a:not(.active):hover { ... }
Toutefois, cela peut ne pas fonctionner dans tous les navigateurs, car tous n'implémentent pas les fonctionnalités CSS3.
Si vous ciblez un large public et souhaitez prendre en charge des navigateurs plus anciens, le mieux serait de définir un style pour le .active:hover et annulez ce que vous faites dans a:hover.