:active
Selectorul pseudo schimbă aspectul unei legături în timp ce este activat ( a se face clic pe sau în alt mod activat). De obicei, se vede doar pentru o fracțiune de secundă și oferă feedback vizual că elementul a fost într-adevăr făcut clic. Este cel mai folosit în legăturile de ancorare ( ).
De exemplu, iată CSS care va face ca legăturile de ancorare să lovească un pixel (dând impresia că sunt împinse în spațiu tridimensional) în starea activă:
Vedeți Pen: starea activă de CSS-Tricks Team (@ css-tricks) pe CodePen.
: Activul se poate aplica și oricărui element. În stiloul de mai jos, făcând clic oriunde pe pagină, veți face întreaga pagină galbenă:
Vedeți Demo-ul stiloului: clasa psuedo activă de CSS-Tricks Team (@ css-tricks) pe CodePen.
Este cea mai bună practică să acoperiți toate „statele”, în special pentru legături. O modalitate ușoară de a face acest lucru este „LOVE HATE” sau
L: link
O
V: vizitat
E
H: plasați
A: activ
T
E
Este ideal să le faci în această ordine.
a:link ( /* Essentially means a(href), or that the link actually goes somewhere */ color: blue; ) a:visited ( color: purple; ) a:hover ( color: green; ) a:active ( color: red; )
În caz contrar, spuneți dacă ați enumerat ultimul stil: vizitat, dacă linkul a fost vizitat, acesta va înlocui declarația: active și: hover, iar legătura ar fi întotdeauna purpurie, indiferent dacă plasați sau dacă linkul era activ (nu ideal).
Suport pentru browser
Crom | Safari | Firefox | Operă | IE | Android | iOS |
---|---|---|---|---|---|---|
Da | 2.0.4+ | orice | 4+ | 4+ | TBD | TBD |