:activeSelektor pseudo zmienia wygląd łącza podczas gdy jest aktywna (klikane lub inaczej włączone). Zwykle jest to widoczne tylko przez ułamek sekundy i zapewnia wizualną informację, że element został rzeczywiście kliknięty. Jest najczęściej używany w linkach zakotwiczenia ( ).
Na przykład, oto CSS, który spowoduje, że linki zakotwiczenia spadną o jeden piksel (sprawiając wrażenie, że są wypychane w trójwymiarowej przestrzeni) w stanie aktywnym:
Zobacz stan Pen: active by CSS-Tricks Team (@ css-tricks) na CodePen.
: Aktywne można również zastosować do dowolnego elementu. W poniższym piórze kliknięcie w dowolnym miejscu strony spowoduje, że cała strona będzie żółta:
Zobacz Demo Pen klasy: active psuedo autorstwa CSS-Tricks Team (@ css-tricks) na CodePen.
Najlepiej jest uwzględnić wszystkie „stany”, szczególnie w przypadku linków. Prostym sposobem na to jest „MIŁOŚĆ NIENAWIŚCI” lub
L: łącze
O
V: odwiedzone
E
H: najechanie kursorem
A: aktywne
T
E
Robienie ich w tej kolejności jest idealne.
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; )W przeciwnym razie powiedzmy, że jeśli umieścisz styl: visit last, jeśli ten link był odwiedzany, nadpisałby deklarację: active i: hover, a link zawsze byłby fioletowy, niezależnie od tego, czy był najechanie kursorem, czy był aktywny (nie jest to idealne).
Wsparcie przeglądarki
| Chrom | Safari | Firefox | Opera | TO ZNACZY | Android | iOS |
|---|---|---|---|---|---|---|
| tak | 2.0.4+ | każdy | 4+ | 4+ | TBD | TBD |