Pseudo klasa:active
Właściwość :active CSS pseudo-class jest używany w momencie aktywowania danego elementu przez użytkownika. Podczas interakcji z myszą zazwyczaj jest to czas pomiędzy naciśnięciem przycisku myszy a zwolnieniem go. Pseudo klasa :active jest często używna z elementami HTML jak <a> lub <button> ale nie tylko.
Pseudo klasa :active może zostać zastąpiona przez inne pseudo-klasy powiązane z linkami, takie jak : link, : hover i {cssxref (": visited" )}}, które mogą się pojawić w kolejnych regułach. W celu dopasowania odpowiednich linków, należy umieścić: active we wszystkich innych regułach linków, zgodnie z definicją zlecenia LVHA:: link -: visited -: hover -: active.
:active dla przycisku podstawowego.Składnia
:active
Przykład
HTML
<body> <h1>:active przykład selektora CSS</h1> <p>Ten link zmieni się w czasie kliknięcia i zwolnienia<a href="#">Mozilla Developer Network</a>.</p> </body>
CSS
body { background-color: #ffffc9 }
a:link { color: blue } /* unvisited links */
a:visited { color: purple } /* visited links */
a:hover { font-weight: bold } /* user hovers */
a:active { color: lime } /* active links */
Specyfikacja
| Specification | Status | Comment |
|---|---|---|
| WHATWG HTML Living Standard The definition of ':active' in that specification. |
Living Standard | |
| Selectors Level 4 The definition of ':active' in that specification. |
Working Draft | No change. |
| Selectors Level 3 The definition of ':active' in that specification. |
Recommendation | No change. |
| CSS Level 2 (Revision 1) The definition of ':active' in that specification. |
Recommendation | No change. |
| CSS Level 1 The definition of ':active' in that specification. |
Recommendation | Initial definition. |
Wsparcie przeglądarek
| Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Basic support | 1.0 | (Yes) | 1.0 (1.7 or earlier) | 4.0 | 5.0 | 1.0 |
Support on non-<a> elements |
1.0 | (Yes) | 1.0 (1.7 or earlier) | 8.0 | 7.0 | 1.0 |
| Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Basic support | 1.0 | (Yes) | 1.0 (1.0) | 6.0 | 6.0 | 1.0 |
Support on non-<a> elements |
1.0 | (Yes) | 1.0 (1.0) | ? | ? | (Yes) [1] |
[1] By default, Safari Mobile does not use the :active state unless there is a touchstart event handler on the relevant element or on the <body>.