# Pseudo-Classes and Pseudo-Elements

Pseudo-Classes and Pseudo-Elements: Pseudo-Classes: :hover, :focus-visible, :nth-child() and More, Pseudo-Elements: ::before, ::after and ::marker, Modern…

Updated: November 10, 2026

1. [Pseudo-Classes: :hover, :focus-visible, :nth-child() and More](https://www.ask-codey.com/lessons/css-pseudo-classes) (Apprentice): Pseudo-classes select elements by their state, such as hovered, focused, checked or disabled, or by their position, such as first, last or every other, and :not() leaves some out.
2. [Pseudo-Elements: ::before, ::after and ::marker](https://www.ask-codey.com/lessons/css-pseudo-elements) (Apprentice): Pseudo-elements style a part of an element, or add decoration before or after it, such as a play icon, a quote mark, a list's numbers, a text box's placeholder or highlighted text, without changing the HTML.
3. [Modern Selectors: :is(), :where() and :has()](https://www.ask-codey.com/lessons/css-is-where-has) (Journeyman): The :is() and :where() pseudo-classes shorten long selector lists, :where() with no specificity at all, and :has() styles an element by what it contains, so a page can react to a click with no JavaScript.

Source: https://www.ask-codey.com/courses/css-in-depth/topics/css-pseudo-classes-and-pseudo-elements