Web Developer's Reference Guide

Pseudo-elements

These are selectors that go beyond what is specified in the document. The selectors select things that may not even be elements in the document. Pseudo-elements are not considered part of a simple selector. This means that you cannot use a pseudo-element as part of the :not() selector. Finally, only one pseudo-element can be present per selector.

Note

Note that all of the pseudo-elements start with a double colon (::). This was introduced in CSS3 to help differentiate between pseudo-classes that have a single colon (:). This is important because in CSS2, pseudo-elements only had the single colon. For the most part, you should use the double colon.

::before and ::after

These are used to insert generated content before or after the selected ...