Selektor	Przykład	Opis przykładu
*	*	Selektor uniwersalny. Wybiera wszystkie elementy. Może również wybrać wszystkie elementy w innym elemencie.
element	p	Selektor elementu (typu, znacznika). Wybiera określony element, tu: <p>.
#id	#firstname	Selektor identyfikatora. Wybiera element z konkretnym identyfikatorem, tu: "firstname" (id="firstname")
.class	.intro	Selektor klasy. Wybiera elementy konkretnej klasy, tu: "intro" (class="intro")
element, element	div, p	Selektor grupowania. Wybiera wymienione (oddzielane przecinkiem) elementy, tu: <div> i <p>.
element.class	p.intro	Wybiera określony element z konkretną klasą, tu element <p> z class="intro"
.class1.class2	.kla1.kla2	Wybiera element z określonym zbiorem klas, tu: kla1 i kla2 (element musi być elementem wszystkich wymienionych klas).
przodek potomek	div p	Selektor potomka. Wybiera wszystkie <p> elementy wewnątrz elementu <div>. Potomek nie musi leżeć bezpośrednio wewnątrz znacznika przodka. Może być zawarty jeszcze w innych znacznikach, które z kolei zawierają się w rodzicu. Nie jest wtedy konieczne podawanie w deklaracji wszystkich rodziców, a jedynie przodka i potomka.
.classprzo .classpot	.kla1 .kla2	Wybiera element konkretnej klasy (tu: kla2), który jest potomkiem elementu podanej klasy (tu: kla1).
rodzic > dziecko	div > p	Selektor dziecka. Wybiera wszystkie <p> elementy, których rodzicem jest element <div>. Pozwala nadać atrybuty elementom, które leżą o jeden rząd niżej w hierarchii drzewa dokumentu. Znacznik będący dzieckiem, musi znajdować się bezpośrednio wewnątrz znacznika rodzica.
element + element	div + p	Selektor sąsiadującego brata. Wybiera wszystkie elementy (tu: <p>), które są umieszczone natychmiast po innym elemencie (tu: <div>).
element1 ~ element2	p ~ ul	Selektor braci. Wybiera każdy element (tu: <ul>) poprzedzony innym elementem (tu: <p>).
[attribute]	[target]	Selektor atrybutu. Wybiera wszystkie elementy z atrybutem target
[attribute=value]	[target=_blank]	Wybiera wszystkie elementy z konkretną wartością określonego atrybutu, tu: target="_blank"
[attribute~=value]	[title~=mak]	Wybiera wszystkie elementy z danym atrybutem (tu: title) o wartości zawierającej słowo "mak"
[attribute|=value]	[lang|=en]	Wybiera wszystkie elementy with a lang attribute value starting with "en"
[attribute^=value]	a[href^="https"]	Wybiera każdy element (tu <a>), którego wartość atrybutu (tu: href) zaczyna się od "https"
[attribute$=value]	a[href$=".pdf"]	Wybiera każdy element (tu <a>), którego wartość atrybutu (tu: href) kończy się ciągiem znaków ".pdf"
[attribute*=value]	a[href*="w3schools"]	Wybiera każdy element (tu <a>), którego wartość atrybutu (tu: href) zawiera podciąg znaków, tu: "w3schools"
:active	a:active	Wybiera aktywny element, tu: link
:hover	a:hover	Wybiera element "pod" (wskazany) myszką, tu: link
::after	p::after	Wybiera określony element (tu p) i określa wstawianie po nim jakiejś zawartość content
::before	p::before	Wybiera określony element (tu p) i określa wstawianie przed nim jakiejś zawartość content
:checked	input:checked	Wybiera każdy 'checked' (oznaczony ptaszkiem, fajką) element <input> (np. w radio buttons, checkboxes)
:default	input:default	Wybiera domyślny element formularza w grupie powiązanych elementów (tu w <input>). Tylko w elementach button, input type = "checkbox", input type = "radio" i option.
:disabled	input:disabled	Wybiera każdy nieaktywny element <input> (głównie stosowany w formularzach)
:enabled	input:enabled	Wybiera każdy aktywny element <input> (głównie stosowany w formularzach)
:empty	p:empty	Wybiera każdy element (tu: <p>), który jest pusty - nie ma elementów potomnych (ani węzłów tekstowych)
:first-child	p:first-child	Wybiera każdy element (tu: <p>), który jest pierworodny (jest pierwszym dzieckiem rodzica), może być np. pierwszym elementem p w body, w h1, w div, itp. itd.
::first-letter	p::first-letter	Wybiera pierwszą literę (tu: każdego elementu <p>)
::first-line	p::first-line	Wybiera pierwszą linię (tu: każdego elementu <p>)
:first-of-type	p:first-of-type	Wybiera każdy element <p>, który jest pierwszym elementem <p> rodzica
:focus	input:focus	Wybiera element input, który przyjął zogniskowanie (focus)
:in-range	input:in-range	Wybiera elementy input o wartościach, które mieszczą się w zakresie (działa tylko dla elementów wejściowych z atrybutami min i / lub max)
:out-of-range	input:out-of-range	Wybiera wszystkie elementy o wartości, która znajduje się na zewnątrz określonego zakresu. Tylko dla elementów input z atrybutami min i / lub max.
:indeterminate	input:indeterminate	Wybiera elementy, które znajdują się w stanie nieokreślonym (można używać tylko w elementach input type = "checkbox", input type = "radio" i progress
:invalid	input:invalid	Wybiera wszystkie elementy ze złą wartością (niezgodną z ustawieniami)
:lang(language)	p:lang(it)	Wybiera każdy element (tu: <p>) z atrybutem 'lang' o wartości równej "it"
:last-child	p:last-child	Wybiera każdy element (tu: <p>) który jest ostatnim dzieckiem swojego rodzica. Tożsamy z p:nth-last-child(1)
:last-of-type	p:last-of-type	Wybiera ostatni element określonego typu (tu: <p>)
:link	a:link	Wybiera wszystkie nieodwiedzone linki
:not(selector)	:not(p)	Wybiera wszystkie elementy prócz elementu <p>
:nth-child(n)	p:nth-child(2)	Wybiera każdy określony element (tu: <p>) który jest kolejnym (tu: drugim) dzieckiem swoich rodziców
:nth-last-child(n)	p:nth-last-child(2)	Wybiera każdy element <p>, który jest kolejnym (tu: drugim) dzieckiem swoich rodziców od końca/td>
:nth-last-of-type(n)	p:nth-last-of-type(2)	Wybiera każdy element <p>, który jest drugim od końca elementem <p> swoich rodziców
:nth-of-type(n)	p:nth-of-type(2)	Wybiera każdy element <p> który jest drugim elementem <p> rodziców
:only-of-type	p:only-of-type	Wybiera każdy wskazany element (tu: <p>), który jest jedynym dzieckiem tego typu (<p>) swojego rodzica
:only-child	p:only-child	Wybiera każdy element (tu: <p>), który jest jedynym dzeckiem rodzica
:optional	input:optional	Wybiera elementy formularza, które są opcjonalne (nie: "required" - wymagane). Używany tylko do elementów formularza: input, select i textarea
::placeholder	input::placeholder	Wybiera elementy z tekstem zastępczym "placeholder".
:read-only	input:read-only	Wybiera elementy z atrybutem „tylko do odczytu” ("readonly")
:read-write	input:read-write	Wybiera elementy, które nie są "readonly"
:required	input:required	Wybiera tylko elementy fomularza z atrybutem wymagany ("required"). Dotyczy tylko elementów formularza: input, select i textarea.
:root	:root	Wybiera główny element (korzeń) dokumentu (czyli: html)
::selection	::selection	Wybiera zaznaczenie użytkownika (ograniczone w stylizowaniu do: color, background-color, cursor, caret-color, outline, text-decoration, text-emphasis-color, text-shadow)
:target	#news:target	Wybiera bieżący aktywny element #news (kliknięty adres URL zawierający nazwę tej kotwicy)
:valid	input:valid	Wybiera wszystkie elementy formularza, które sprawdzają poprawność wypełnienia pola zgodnie z ustawieniami elementu.
:visited	a:visited	Wybiera wszystkie odwiedzone linki (ograniczony w stylizowaniu do: color, background-color, border-color, outline color, column-rule-color, kolory wypełnienia i obrysu)

Uwagi: (n) może być liczbą, słowem kluczowym lub formułą. Np. parzyste i nieparzyste to (odd) i (even)