¿Qué significa el selector CSS a:after y el cuerpo html div.a?

Existen etiquetas div: before y div: after en las etiquetas css, que algunas personas encuentran extrañas. ¿Cuáles son entonces estas dos etiquetas? ¿De qué sirve?

:before y :after son pseudoelementos CSS, su uso básico se puede encontrar en el manual de CSS:

E::before establece lo que sucedió antes del objeto (según el estructura lógica del árbol de objetos). Usado con el atributo de contenido.

E::after Qué sucede después de configurar el objeto (según la estructura lógica del árbol de objetos). Ie6-7 no es compatible con atributos de contenido.

Html body div.a es la clase a en el div dentro del cuerpo de Html.

Así:

lthtml gt

ltbody gt

ltdiv gt ltp class="a" /> lt/div gt ;

lt/body gt;

lt/html gt;