:active
- Data publikacji
- Ostatnio edytowano
Przeznaczenie selektora :active
:active { ... }
Selektor :active
odwołuje się do każdego elementu HTML, którego cechy w danym momencie spełniają zasadę pseudoklasy :active
.
Cechy elementu HTML spełniają zasadę pseudoklasy :active
od momentu przytrzymania przez nas lewego przycisku myszy nad obszarem interesującego nas elementu HTML lub nad treścią znajdującą się w zawartości interesującego nas elementu HTML, aż do momentu gdy wspomniany przycisk zostanie przez nas puszczony.
Informacje techniczne o selektorze :active
- ograniczenie - elementy HTML
-
brak
- ograniczenie - właściwości CSS
-
brak
Przykładowa reguła CSS, selektor :active
p:active {
color:red;
}
Wyjaśnienie przykładowej reguły CSS
p:active { color:red; }
p:active
-
do każdego elementu
p
, którego cechy w danym momencie spełniają zasadę pseudoklasy:active
color
-
dodaj właściwość CSS, która zmieni kolor tekstu elementu HTML
red
-
na barwę czerwoną
Kod źródłowy przykładowego dokumentu HTML
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Darmowy Kurs CSS</title>
<style>
p {
border:3px solid black;
}
p:active {
color:red;
}
</style>
</head>
<body>
<p>
od momentu gdy przytrzymasz nad obszarem tego elementu "p" lewy przycisk myszy, do momentu gdy wspomniany przycisk zostanie przez Ciebie puszczony, tekst znajdujący się w zawartości tego elementu "p" będzie posiadał kolor czerwony
</p>
<p>
od momentu gdy przytrzymasz nad obszarem tego elementu "p" lewy przycisk myszy, do momentu gdy wspomniany przycisk zostanie przez Ciebie puszczony, tekst znajdujący się w zawartości tego elementu "p" będzie posiadał kolor czerwony
</p>
<p>
od momentu gdy przytrzymasz nad obszarem tego elementu "p" lewy przycisk myszy, do momentu gdy wspomniany przycisk zostanie przez Ciebie puszczony, tekst znajdujący się w zawartości tego elementu "p" będzie posiadał kolor czerwony
</p>
</body>
</html>
Rezultat
od momentu gdy przytrzymasz nad obszarem tego elementu "p" lewy przycisk myszy, do momentu gdy wspomniany przycisk zostanie przez Ciebie puszczony, tekst znajdujący się w zawartości tego elementu "p" będzie posiadał kolor czerwony
od momentu gdy przytrzymasz nad obszarem tego elementu "p" lewy przycisk myszy, do momentu gdy wspomniany przycisk zostanie przez Ciebie puszczony, tekst znajdujący się w zawartości tego elementu "p" będzie posiadał kolor czerwony
od momentu gdy przytrzymasz nad obszarem tego elementu "p" lewy przycisk myszy, do momentu gdy wspomniany przycisk zostanie przez Ciebie puszczony, tekst znajdujący się w zawartości tego elementu "p" będzie posiadał kolor czerwony
Interpretacja selektora :active
-
tak
-
tak
-
tak
-
tak
-
tak
-
tak