30. :read-write - CSS3

Przeznaczenie selektora `:read-write`

:read-write { ... }

Selektor :read-write odwołuje się do każdego elementu HTML, którego cechy w danym momencie spełniają zasadę pseudoklasy :read-write.

Cechy elementu HTML spełniają zasadę pseudoklasy :read-write, gdy w danym momencie do danego elementu HTML możemy wprowadzić własny tekst.

Informacje techniczne o selektorze `:read-write`

ograniczenie - elementy HTML

brak

ograniczenie - właściwości CSS

brak

Przykładowa reguła CSS, selektor `:read-write`

p:read-write {
  color:red;
}

Wyjaśnienie przykładowej reguły CSS

p:read-write { color:red; }

p:read-write

do każdego elementu p, do którego możemy wprowadzić własny tekst

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>Kurs CSS</title>

    <style>
      p:read-write {
        color:red;
      }
    </style>
  </head>

  <body>

    <p>
      tekst znajdujący się w zawartości tego elementu "p" nie 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" 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" nie jest koloru czerwonego, ponieważ do tego elementu "p" nie możemy wprowadzić własnego tekstu
    </p>

  </body>
</html>

Rezultat

Interpretacja selektora `:read-write`

Previous29. :read-only - CSS3 Next31. :default - CSS3

Last updated 1 month ago

hashtagPrzeznaczenie selektora :read-write

hashtagInformacje techniczne o selektorze :read-write

hashtagPrzykładowa reguła CSS, selektor :read-write

hashtagWyjaśnienie przykładowej reguły CSS

hashtagKod źródłowy przykładowego dokumentu HTML

hashtagRezultat

hashtagInterpretacja selektora :read-write