CSS selector reference håndbog

CSS-vælger

CSS-vælgere bruges til "finde" (eller vælge) de HTML-elementer, du vil sætte stil på.

Brug vores CSS-vælger-tester til at demonstrere forskellige vælgere.

CSS-enkel vælger

Enkel vælger vælger elementer baseret på elementnavn, id og klasse. Derudover er der også universelle vælgere (*)

Vælger Eksempel Eksempelbeskrivelse
element p Vælg alle <p>-elementer.
#id #firstname Vælg elementet med id="firstname".
* * Vælg alle elementer.
.class .intro Vælg alle elementer med class="intro".

CSS-egenskabsvælger

Egenskabsvælger vælger HTML-elementer med en given egenskabsmængde.

Vælger Eksempel Eksempelbeskrivelse
[attribute] [target] Vælg alle elementer, der har target-attributten.
[attribute=value] [target=_blank] Vælg alle elementer, der har target="_blank"-attributten.
[attribute~=value] [title~=flower] Vælg alle elementer, hvis title-attribut indeholder ordet "flower".
[attribute|=value] [lang|=en] Vælg alle elementer, hvis lang-attribut starter med "en".
[attribute^=value] a[href^="https"] Vælg hvert <a>-element, hvis href-attribut starter med "https".
[attribute$=value] a[href$=".pdf"] Vælg alle <a>-elementer, hvis src-attribut ender med ".pdf".
[attribute*=value] a[href*="codew3c"] Vælg hver <a>-element, der indeholder understreng "abc" i href-attributten.

CSS nested selector

Vælger Eksempel Eksempelbeskrivelse
& & Anvend stil på element i konteksten af et andet element