Mettre en surbrillance un onglet actif - CSS

Question

J'ai une petite configuration de navigation à onglets utilisant CSS. Lorsque vous passez la souris sur les onglets, la couleur change, très bien. Cependant, lorsque je clique sur un onglet pour accéder à la page correspondante, je souhaite que cet onglet (l'onglet actif?) Reste en surbrillance, indiquant la page en cours.

Je le fais actuellement en utilisant une classe (.currenttab) puis en utilisant cette classe dans chaque fichier HTML. Je n'utilise pas:

active

Puis-je utiliser active, plutôt que d'utiliser une classe dans chaque fichier HTML, ou bien ce que je fais est-il correct?

Merci d'avance.

Answer 1

Ce que vous faites est correct. Le : actif , le pseudo sélecteur signifie autre chose: l'événement d’activer un contrôle (c’est-à-dire le temps qui s’écoule entre le moment où un utilisateur appuie sur le bouton de la souris et le relâche).

Utiliser une classe pour indiquer que l'élément sélectionné est la voie à suivre.

Answer 2

C’est loin d’être idéal, mais si vous attribuez un identifiant à chaque page et à chaque onglet, vous pouvez définir la surbrillance dans css au lieu de html. J'ai trouvé une explication complète en recherchant l'attribut actif:

Mise en surbrillance de la page en cours avec CSS

Un site que j'ai conçu avec cette technique (des pages, pas des onglets)

Answer 3

Voici d'autres exemples de démonstration de brainjar
Plus d'informations sur Brainjar