Selector Example Example description

Selects all elements with

.class .intro
class="intro"

Selects all elements with both

<div class="name1
.class1.class2 name1 and name2 set within its
name2">...</div>
class attribute

<div
class="name1">
  <div Selects all elements with name2 that
.class1 .class2 class="name2"> is a descendant of an element with
    ... name1
  </div>
</div>

Selects the element with

#id #firstname
id="firstname"

* * Selects all elements

element p Selects all <p> elements

Selects all <div> elements and all

element,element div, p
<p> elements

Selects all <p> elements inside

element element div p
<div> elements

Selects all <p> elements where the

element>element div > p
parent is a <div> element
 Selects all <p> elements that are
element+element div + p placed immediately after <div>
elements

Selects every <ul> element that are

element1~element2 p ~ ul
preceded by a <p> element

Selects all elements with a target

[attribute] [target]
attribute

Selects all elements with

[attribute=value] [target=_blank]
target="_blank"

Selects all elements with a title

[attribute~=value] [title~=flower] attribute containing the word
"flower"

Selects all elements with a lang

[attribute|=value] [lang|=en]
attribute value starting with "en"

Selects every <a> element whose

[attribute^=value] a[href^="https"] href attribute value begins with
"https"

Selects every <a> element whose

[attribute$=value] a[href$=".pdf"]
href attribute value ends with ".pdf"

Selects every <a> element whose

[attribute*=value] a[href*="w3schools"] href attribute value contains the
substring "w3schools"

:active a:active Selects the active link

 Insert something after the content of
::after p::after
each <p> element

Insert something before the content

::before p::before
of each <p> element

Selects every checked <input>

:checked input:checked
element

:default input:default Selects the default <input> element

Selects every disabled <input>

:disabled input:disabled
element

Selects every <p> element that has

:empty p:empty
no children (including text nodes)

Selects every enabled <input>

:enabled input:enabled
element

Selects every <p> element that is

:first-child p:first-child
the first child of its parent

Selects the first letter of every <p>

::first-letter p::first-letter
element

Selects the first line of every <p>

::first-line p::first-line
element

Selects every <p> element that is

:first-of-type p:first-of-type
the first <p> element of its parent
 Selects the input element which has
:focus input:focus
focus

:hover a:hover Selects links on mouse over

Selects input elements with a value

:in-range input:in-range
within a specified range

Selects input elements that are in an

:indeterminate input:indeterminate
indeterminate state

Selects all input elements with an

:invalid input:invalid
invalid value

Selects every <p> element with a

:lang(language) p:lang(it)
lang attribute equal to "it" (Italian)

Selects every <p> element that is

:last-child p:last-child
the last child of its parent

Selects every <p> element that is

:last-of-type p:last-of-type
the last <p> element of its parent

:link a:link Selects all unvisited links

Selects every element that is not a

:not(selector) :not(p)
<p> element

Selects every <p> element that is

:nth-child(n) p:nth-child(2)
the second child of its parent
 Selects every <p> element that is
:nth-last-child(n) p:nth-last-child(2) the second child of its parent,
counting from the last child

Selects every <p> element that is

:nth-last-of-type(n) p:nth-last-of-type(2) the second <p> element of its
parent, counting from the last child

Selects every <p> element that is

:nth-of-type(n) p:nth-of-type(2) the second <p> element of its
parent

Selects every <p> element that is

:only-of-type p:only-of-type
the only <p> element of its parent

Selects every <p> element that is

:only-child p:only-child
the only child of its parent

Selects input elements with no

:optional input:optional
"required" attribute

Selects input elements with a value

:out-of-range input:out-of-range
outside a specified range

Selects input elements with

::placeholder input::placeholder
placeholder text

Selects input elements with the

:read-only input:read-only
"readonly" attribute specified

Selects input elements with the

:read-write input:read-write
"readonly" attribute NOT specified
 Selects input elements with the
:required input:required
"required" attribute specified

:root :root Selects the document's root element

Selects the portion of an element

::selection ::selection
that is selected by a user

Selects the current active #news

:target #news:target element (clicked on a URL containing
that anchor name)

Selects all input elements with a

:valid input:valid
valid value

:visited a:visited Selects all visited links