Marusya's School Notes

Pseudo-Elements

A CSS pseudo-element is used to style specified parts of an element. For example, it can be used to:

Style the first letter, or line, of an element
Insert content before, or after, the content of an element

The syntax of a pseudo-element is:

selector::pseudo-element { property:value; }

Notice the double colon notation:

::first-line versus :first-line.

The double colon replaced the single-colon notation for pseudo-elements in CSS3. This was an attempt from W3C to distinguish between pseudo-classes and pseudo-elements. The single-colon syntax was used for both pseudo-classes and pseudo-elements in CSS2 and CSS1. For backward compatibility, the single-colon syntax is acceptable for CSS2 and CSS1 pseudo-elements.