Styling the First Letter

Drop caps have been used for a long time with print media to add flair to the first letter of a section or chapter. It draws attention and entices the reader.

The ::first-letter pseudo-element applies styles to the first letter of a block container.

1-Minute Video

Syntax

This is the syntax. Append the pseudo element after the target element selector and change the styles of the first letter.

p::first-letter {
    font-size: 200%;
    color: blue;
}