Websites met stijl

Naslag: Selectors

Op dit naslagblad

Selectors en declaraties

De algemene vorm van een stijlregel is: selector, selector, selector { declaratie; declaratie; declaratie;}

Dit naslagblad gaat over de vorm van de selector.

Selectors

Hieronder staan enkele belangrijke selectors
Klik op een selector voor uitgebreidere info:

selector voorbeeld omschrijving
*   * selecteert alle elementen (de universele selector).
element p selecteert alle p-elementen
element1, element2 p, h1 selecteert alle p-elementen én alle h1-elementen
element1 element2 div pselecteert alle p-elementen binnen div (descendants)
element1 > element2 div > p selecteert alle p-elementen die een child zijn van div
.class .groot selecteert alle elementen van de class 'groot'
#id #container selecteert het element van de id 'container'
element.class p.groot selecteert de p-elementen van de class 'groot'
element#id div#container selecteert het div-element met de id container
[attribuut] [href] selecteert alle elementen met het attribuut href
[attribuut=waarde] [href=""] selecteert alle elementen met href="" (een lege link)
pseudo classes
:link a:link selecteert alle niet bezochte links
:visited a:visited selecteert alle bezochte links
:hover a:hover selecteert de link waar de muis over beweegt
:active a:active selecteert de actieve link
pseudo elementen
::first-letter p::first-letter selecteert de eerste letter van de alinea
::first-line p::first-line selecteert de eerste regel van de alinea

(Kijk op w3schools voor een volledige lijst)