:active
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 |
---|---|---|
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>
.