Evidenziando una scheda attiva - CSS

Question

Ho una piccola configurazione di navigazione a schede che usa CSS. Passando il mouse sopra le schede il colore cambia, fantastico. Tuttavia, quando faccio clic su una scheda e passa alla pagina corrispondente, vorrei che quella scheda (la scheda attiva?) Rimanga evidenziata, indicando la pagina corrente.

Attualmente sto facendo questo usando una classe (.currenttab) e quindi usando questa classe in ogni file HTML. Non sto usando:

active

Esiste un modo per utilizzare attivo, anziché utilizzare una classe in ogni singolo file HTML, o è quello che sto facendo correttamente?

Grazie in anticipo.

Answer 1

Quello che stai facendo è corretto. Il pseudo-selettore : active significa qualcos'altro: l'evento di attivazione di un controllo (ovvero, il tempo che intercorre tra un utente preme il pulsante del mouse e lo rilascia).

L'uso di una classe per indicare l'elemento selezionato è la strada da percorrere.

Answer 2

È tutt'altro che ideale, ma se dai a ogni pagina e ogni scheda un ID, puoi definire l'evidenziazione in CSS anziché in HTML. Ho trovato una spiegazione completa mentre cercavo l'attributo attivo:

Evidenziazione della pagina corrente con CSS

Un sito che ho progettato con questa tecnica (pagine, non schede)

Answer 3

Ecco alcuni altri esempi brainjar Demo
Altro da Brainjar