All cheat sheets

CSS

CSS selectors cheat sheet

A quick reference for CSS selectors: combinators, attribute matching, structural pseudo-classes, and the modern :is(), :where() and :has() functions with their specificity rules.

Combinators

Attributes

Structural

Functional

State

Pseudo-elements

Things worth remembering

  • :where() always has zero specificity, :is() takes the specificity of its most specific argument.
  • :has() is a parent selector: .card:has(img) styles the card, not the image.
  • :nth-child(An+B of S) filters first by selector S, then counts, unlike :nth-of-type.

More CSS sheets