Nearby lessons
13 of 19๐ CSS Links & Pseudo-classes
๐ What are CSS Links & Pseudo-classes?
CSS Links & Pseudo-classes allow developers to style anchor elements and other HTML tags based on user interaction or structural position.
This includes styling links with :link, :hover, :visited, :active, and other pseudo-classes like :focus, :first-child, and ::selection.
๐จ Basic Link Styles
Styling anchor tags for different states: link, visited, hover, and active.
Code Example
PREVIEW READY
๐ :focus Pseudo-class
Styles elements like inputs and buttons when they receive focus.
Code Example
PREVIEW READY
๐ถ :first-child Pseudo-class
Targets the first child in a parent element.
Code Example
PREVIEW READY
๐ข :nth-child() Pseudo-class
Selects elements based on position (even, odd, 3n, etc.).
Code Example
PREVIEW READY
๐ซ :not() Pseudo-class
Selects all elements except those that match a selector.
Code Example
PREVIEW READY
โฎ๏ธ ::before and ::after Pseudo-elements
Insert content before or after elements.
Code Example
PREVIEW READY
๐๏ธ ::selection Pseudo-element
Style the portion of text selected by the user.
Code Example
PREVIEW READY
๐ง Test Your Knowledge
5 QuestionsProgress: 0 / 5
Keep Going!CSS - Lists