Pseudo Classes To Know

Pseudo classes enable you to apply certain styling rules on specific states of the chosen element. There is just a colon between the selector and the pseudo class – selector:pseudo class { property: value; }

Note that many CSS proposals are not supported by all browsers. We are going to discuss the following four pseudo classes that can be used when applied to links.

link – unvisited link.

visited – a link to a page that has already been visited.

active – selected link.

hover – the cursor is held over the link.

However, pseudo classes (except hover) are not often used today. But still it is recommended to provide site visitors with an opportunity to have different colours for visited links.

As a rule, text links are blue if not visited and purple if visited. These colours are considered to be the most effective even with many users say they even don’t pay attention to the colours of links. So, it is still better to use them.

a.snowman:link {
color: blue;
}

a.snowman:visited {
color: purple;
}

a.snowman:active {
color: red;
}

a.snowman:hover {
text-decoration: none;
color: blue;
background-color: yellow;
}

The other thing you should be able to do is to use the hover pseudo class with other elements except links. However, Internet Explorer doesn’t support this method and you should take it into consideration when trying to create some nice and attractive things that will make your site look great in other browsers.