CSS selectors are used to "find" (or select) the HTML elements you want to style.

We can divide CSS selectors into five categories:
  • Simple selectors (select elements based on name, id, class)
  • Combinator selectors (select elements based on a specific relationship between them)
  • Pseudo-class selectors (select elements based on a certain state)
  • Pseudo-elements selectors (select and style a part of an element)
  • Attribute selectors (select elements based on an attribute or attribute value)

All CSS Simple Selectors

SelectorExampleExample description
.class.introSelects all elements with class="intro"
#id#firstnameSelects the element with id="firstname"
**Selects all elements
elementpSelects all <p> elements
element,element,..div, pSelects all <div> elements and all <p> elements