Before, Hover, Visited, Active, After

Before

As we can see '*' which appears before the text, now if we try to inspect the page it would not show there. It is a example of before feature.
It's use in form to tell the user which query, they must have to fill.

Hover

When we move our cursor on the text hover it would become bigger in size and change color (we can add here other css Proparties).
It's use to make the page more interactive attractive or tell the user where the cursor is.

Visited

If you click on the 'visited' link it's text color will be changed.
:visited proparty is used to tell the user, which link they have alrady visited.

Active

If we click or just click and hold on the 'Active' button it will be change its font size and background color (we can add more css Proparties).
It's use to make the page more interactive attractive or tell the user where the cursor is.

After

It's similer to the :before. We use '*' just after the text.
It's also use in form to tell the user which query, they must have to fill.