Bite-Sized CSS: Pseudo Classes vs. Pseudo Elements

Pseudo Classes

• Starts with one colon.
• Deals with states, such as button:hover, button:focus.
• Selects the whole element.
• MDN Pseudo Classes

Pseudo Elements

• Starts with double colons, ::before, ::first-letter, etc.
• Selects part of the element.
• MDN Pseudo Elements