CSS Pseudo-Elements

Introduction

Syntax

1/* pseudo-element syntax */
2selector::pseudo-element {
3  property: value;
4}

Example

1/* this styles the first line */
2p::first-line {
3  font-weight: bold;
4  color: red;
5}

Key Points

• Pseudo-elements target partial element contents.
• The `::first-letter` creates drop caps.
• The `::before` injects visual content before the element.
• The `::after` injects visual content after the element.