CSS : selettore attivo
Esempio
Seleziona e imposta lo stile del collegamento attivo:
a:active
{
background-color: yellow;
}
Altri esempi "Provalo da solo" di seguito.
Definizione e utilizzo
Il :active
selettore viene utilizzato per selezionare e definire lo stile del collegamento attivo.
Un collegamento diventa attivo quando si fa clic su di esso.
Suggerimento: il selettore :active può essere utilizzato su tutti gli elementi, non solo sui link.
Suggerimento: usa il selettore :link per definire lo stile dei link alle pagine non visitate, il selettore :visited per definire lo stile dei link alle pagine visitate e il selettore :hover per dare uno stile ai link quando ci passi sopra il mouse.
Nota: :active DEVE venire dopo :hover (se presente) nella definizione CSS per essere efficace!
Versione: | CSS1 |
---|
Supporto del browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente il selettore.
Selector | |||||
---|---|---|---|---|---|
:active | 4.0 | 7.0 | 2.0 | 3.1 | 9.6 |
Sintassi CSS
:active {
css declarations;
}
Altri esempi
Esempio
Seleziona e modella un elemento <p>, <h1> e <a> quando fai clic su di esso:
p:active, h1:active, a:active {
background-color: yellow;
}
Esempio
Seleziona e imposta lo stile dei link non visitati, visitati, al passaggio del mouse e attivi:
/* unvisited link */
a:link {
color: green;
}
/* visited link */
a:visited {
color: green;
}
/* mouse over link */
a:hover {
color: red;
}
/* selected link */
a:active {
color: yellow;
}
Esempio
Collegamenti di stile con stili diversi:
a.ex1:hover, a.ex1:active {
color: red;
}
a.ex2:hover, a.ex2:active {
font-size: 150%;
}
Pagine correlate
Tutorial CSS: collegamenti CSS
Tutorial CSS: CSS Pseudo classi