:read-only
- Data publikacji
- Ostatnio edytowano
Przeznaczenie selektora :read-only
:read-only { ... }
Selektor :read-only
odwołuje się do każdego elementu HTML, którego cechy w danym momencie spełniają zasadę pseudoklasy :read-only
.
Cechy elementu HTML spełniają zasadę pseudoklasy :read-only
, gdy w danym momencie do danego elementu HTML nie możemy wprowadzić własnego tekstu.
Informacje techniczne o selektorze :read-only
- ograniczenie - elementy HTML
-
brak
- ograniczenie - właściwości CSS
-
brak
Przykładowa reguła CSS, selektor :read-only
p:read-only {
color:red;
}
Wyjaśnienie przykładowej reguły CSS
p:read-only { color:red; }
p:read-only
-
do każdego elementu
p
, do którego nie możemy wprowadzić własnego tekstu 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:read-only {
color:red;
}
</style>
</head>
<body>
<p>
tekst znajdujący się w zawartości tego elementu "p" jest koloru czerwonego, ponieważ do tego elementu "p" nie możemy wprowadzić własnego tekstu
</p>
<p contenteditable>
tekst znajdujący się w zawartości tego elementu "p" nie jest koloru czerwonego, ponieważ do tego elementu "p" możemy wprowadzić własny tekst
</p>
<p>
tekst znajdujący się w zawartości tego elementu "p" jest koloru czerwonego, ponieważ do tego elementu "p" nie możemy wprowadzić własnego tekstu
</p>
</body>
</html>
Rezultat
tekst znajdujący się w zawartości tego elementu "p" jest koloru czerwonego, ponieważ do tego elementu "p" nie możemy wprowadzić własnego tekstu
tekst znajdujący się w zawartości tego elementu "p" nie jest koloru czerwonego, ponieważ do tego elementu "p" możemy wprowadzić własny tekst
tekst znajdujący się w zawartości tego elementu "p" jest koloru czerwonego, ponieważ do tego elementu "p" nie możemy wprowadzić własnego tekstu
Interpretacja selektora :read-only
-
tak
-
tak
-
tak
-
tak
-
nie
-
tak