before: / after: vs. before:: / after::

https://youtu.be/zGiirUiWslI

: (single colon)

pseudo class

a:hover

 

:: (double colon)

pseudo element

::before, ::after

 

::before (right way to represent a pseudo element based on CSS3), :before

it used to be the same but CSS3 changed it to distinguish pseudo elements from pseudo classes.

but browser still support both of them. (because they don't want to break all of the old stuff and how it used to be done.)