Pseudoklasy

Styl może być nadany trzem typom odsyłaczy (normal, visited, active), jak pokazują następujące przykłady…

  A:link { styleinfo }         /* odsyłacz nie odwiedzany */
  A:visited {styleinfo }   /* odsyłacz odwiedzony */
  A:active { styleinfo }    /* odsyłacz aktywny */
  A:link IMG { styleinfo } /* wszystkie IMG, które są częścią odsyłacza nie odwiedzanego */
  A.classname:visited { styleinfo } /* odwiedzone odsyłacze z klasą */

Pseudoklasa :Hover

Selektor nadaje styl elementowi, gdy urządzenie wskazujące, np. myszka, znajduje się nam elementem. Styl może być “nadpisany”, jeśli po :hover znajduje się np. styl :link.
Example : a:hover {color: rgb(100%,0%,100%) }

Pseudoklasa :Active

Styl jest nadawany wtedy, gdy element staje się aktywny, np. w czasie między naciśnięciem przycisku i zwolnieniem go.
Przykład : a:active {color: rgb(100%,0%,100%) }

Pseudoklasa :Focus

Element przyjmuje fokus (zogniskowanie), gdy zostanie wybrany przez kliknięcie myszką czy skrót klawiszowy albo jest taki ze definicji. Po przyjęciu fokusu element reaguje na klawiaturę lub inne zdarzenia, np. na wpisywanie czegoś w polu tekstowym. textinput:focus {color: rgb(100%,100%,100%) }

Pseudoklasa językowa

Przykład : h1:lang(en) {color:blue}
Kod ten definiuje styl dla elementów, którym nadano definicję języka za pomocą atrybutu HTML lang=. Powyższy przykład dotyczy języka angielskiego i wpływa np. na <H1 lang=en>ten tekst</H1>

Pseudoklasa First Child

Element jest dzieckiem w stosunku do innego elementu, jeśli jest zawarty w jego ramach i jest o jeden szczebel niżej w hierarchii. Jest także pierwszym dzieckiem, jeśli jest w nim pierwszym elementem. Na przykład, w <H1> <H2></H2> <H3></H3></H1>, H2 jest pierwszym dzieckiem H1, ale H3 jest już drugim dzieckiem. W przykładzie, aby wybrać H2, użylibyśmy
H1 > H2:firstchild {styleinfo}
lub H2:firstchild {styleinfo}

Leave a Reply