There are some contexts or states that elements may have that are common enough that the browser provides 'implied' classes on those elements. These pseudo-classes are best illustrated by example. An a href="#" element, for instance, has a number of useful pseudo-classes depending on the state of user-interaction.
:visited:hover:activeAn example link to work with: StackOverflow.com
To some extent, we can use CSS to create elements on the page that are not actually there in our HTML source.These pseudo-elements should generally be used only for styling, but can be extremely useful as a way to avoid putting extra tags on the page solely for creating visual style.
::before::afterAn example html tag: section
An example css rule: p { margin: 1em 0; }
How could we use these to add a < > around html code examples?
How could we use these to add a [css] label before css code examples?
How might we use pseudo elements to add a stylistic flourish to each section of this document?