Selector .

class #id *

Example .intro #firstname * p div,p div p div>p div+p [target] [target=_blank] [title~=flower]

Example description Selects all elements with class="intro" Selects the element with id="firstname" Selects all elements Selects all <p> elements Selects all <div> elements and all <p> elements Selects all <p> elements inside <div> elements Selects all <p> elements where the parent is a <div> element Selects all <p> elements that are placed immediately after <div> elements Selects all elements with a target attribute Selects all elements with target="_blank" Selects all elements with a title attribute containing the word "flower" Selects all elements with a lang attribute value starting with "en" Selects all unvisited links Selects all visited links Selects the active link Selects links on mouse over Selects the input element which has focus Selects the first letter of every <p> element Selects the first line of every <p> element Selects every <p> elements that is the first child of its parent Insert content before every <p> element Insert content after every <p> element Selects every <p> element with a lang attribute value starting with "it" Selects every ul element that are preceded by a p element Selects every a element whose src attribute value begins with "https" Selects every a element whose src attribute value ends with ".pdf"

CSS 1 1 2 1 1 1 2 2 2 2 2 2 1 1 1 1 2 1 1 2 2 2 2 3 3 3 3

element element,element element element element>element element+element

[attribute] [attribute=value] [attribute~=value]

[attribute|=language] [lang|=en] :link :visited :active :hover :focus :first-letter :first-line :first-child :before :after :lang(language) a:link a:visited a:active a:hover input:focus p:first-letter p:first-line p:first-child p:before p:after p:lang(it) p~ul a[src^="https"] a[src$=".pdf"]

element1~element2
[attribute^=value] [attribute$=value] [attribute*=value] :first-of-type :last-of-type :only-of-type

a[src*="w3schools"] Selects every a element whose src attribute value contains the substring "w3schools" p:first-of-type p:last-of-type p:only-of-type

Selects every p element that is the first p element of 3 its parent Selects every p element that is the last p element of 3 its parent Selects every p element that is the only p element of its parent 3

:only-child :nth-child(n) :nth-last-child(n) :nth-of-type(n) :nth-last-of-type(n) :last-child :root :empty :target :enabled :disabled :checked :not(selector) ::selection

p:only-child p:nth-child(2) p:nth-last-child(2) p:nth-of-type(2) p:nth-last-oftype(2) p:last-child :root p:empty #news:target input:enabled input:disabled input:checked :not(p) ::selection

Selects every p element that is the only child of its parent Selects every p element that is the second child of its parent Selects every p element that is the second child of its parent, counting from the last child Selects every p element that is the second p element of its parent Selects every p element that is the second p element of its parent, counting from the last child Selects every p element that is the last child of its parent Selects the documents root element Selects every p element that has no children (including text nodes) Selects the current active #news element (clicked on a URL containing that anchor name) Selects every enabled input element Selects every disabled input element Selects every checked input element Selects every element that is not a p element

3 3 3 3 3 3 3 3 3 3 3 3 3

Selects the portion of an element that is selected by 3 a user