Selectors in CSS
From the CSS cheat sheet · Selectors & Specificity · verified Jul 2026
Selectors
All the ways to target HTML elements with CSS
css
/* Element, class, ID */
p { }
.card { }
#header { }
/* Combinators */
.nav a { } /* descendant */
.nav > li { } /* direct child */
h2 + p { } /* adjacent sibling */
h2 ~ p { } /* general sibling */
/* Attribute */
[type="email"] { }
[href^="https"] { }💡 :has() is a game-changer — it lets you style a parent based on its children
⚡ Use :is() to group selectors without repeating shared styles; :where() is the same but with 0 specificity
📌 Prefer :focus-visible over :focus for keyboard-only focus rings (better UX)
🟢 See also: CSS Flexbox, CSS Grid, and CSS Animations sheets for layout and motion
selectorscombinatorspseudo
Continue with CSS
Save the full cheat sheet or work through every related task.