Il pseudo-selettore :active consente di modificare lo stile di un link mentre è attivo (ovvero mentre qualcuno sta cliccando sopra di esso). Solitamente lo stile così applicato è visibile per qualche una frazione di secondo, e fornisce un feedback visuale per indicare che l’elemento sia stato premuto. Solitamente viene utilizzato con gli anchor link <a>.
Nel seguente esempio, quando un link viene premuto andremo a impostare uno sfondo di un colore diverso utilizzando il selettore CSS:
Il selettore :active può essere applicato su qualsiasi elemento. Nel prossimo esempio vediamo che, cliccando su qualsiasi punto della pagina, tutta la pagina diventerà di colore giallo:
Quando si lavora allo stile dei link, è fortemente consigliato coprire tutti i vari stati in cui un link si può trovare, nel seguente ordine:
:link– indica tutti i link che hanno un attributohref;:visited– quando il link è già stato visitato;:hover– quando si passa con il puntatore sopra il link;:active– quando il link viene premuto.
Ecco un esempio dello stile dei link:
a:link {
color: blue;
}
a:visited {
color: purple;
}
a:hover {
color: green;
}
a:active {
color: red;
}Nel caso non venisse seguito l’ordine elencato, se inseriamo come ultimo stato il visited, il suo stile andrà a sovrascrivere gli stati active e hover, e il link sarebbe sempre viola anche se ci passiamo sopra o lo premiamo con il mouse.