::before / ::after No hace referencia al contenido que existe en el código, sino a una ubicación donde puede insertar el material adicional generado en el CSS. Aunque este contenido no forma parte del DOM, se le puede aplicar estilo.

Ejemplo

See the Pen pseudoelemetos by Bernardo Martin (@bermartinv) on CodePen.

::selection : Coincide con el texto que está resaltado. Esto se soporta en WebKit y con el prefijo de fabricante -moz- en Firefox.

Ejemplo

See the Pen pseudoelemetos by Bernardo Martin (@bermartinv) on CodePen.

:: first-letter / ::first-line : Como su traducción al castellano indica, se refiere a la primera letra del contenido de un elemento y a la primera linea.

Ejemplo

See the Pen pseudoelemetos by Bernardo Martin (@bermartinv) on CodePen.

::inactive-selection :Se aplica a selecciones inactivas (por ejemplo, cuando la ventana de documento está inactiva y, por lo tanto, no recibe eventos).

::spelling-error :Representa una parte del texto que ha sido marcado por el agente de usuario como mal escrito.

::grammar-error :Representa una parte del texto que ha sido marcado por el agente de usuario como gramaticalmente incorrecto.

::marker : Representa el cuadro marcador generado automáticamente de un elemento de lista.

::placeholder : Representa el texto marcador de un input.

Enlace de interes