Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

CSS Pseudo-Classes vs Pseudo-Elements - Pseudo-Selectors Tutorial

Dave Gray via YouTube

Overview

Explore the differences between CSS pseudo-classes and pseudo-elements in this comprehensive tutorial. Dive into various pseudo-selectors, including :active, :is, :any-link, :target, :not, and :nth-child. Learn about specificity with :is and :where, and discover how to create pseudo-elements. Master the use of emoji pseudo-elements and fancy quotes with ::before and ::after. Gain insights into ::first-letter and ::first-line pseudo-elements. Perfect for beginners looking to enhance their CSS skills and create more dynamic web designs.

Syllabus

Intro
Welcome
Pseudo-Classes vs Pseudo-Elements
Starter Code
:active
:is
:any-link
Specificity with :is and :where
:target
:not
:nth-child
Create a pseudo-element
Emoji pseudo-elements
Fancy quotes with ::before and ::after
::first-letter
::first-line

Taught by

Dave Gray

Reviews

Start your review of CSS Pseudo-Classes vs Pseudo-Elements - Pseudo-Selectors Tutorial

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.