How to Style Links Using CSS?

In this post we will learn to style links. But before that we must know different states of a link. A link have four states. They are:
1.   a:link is state of a link when it is not visited. Link is in this state when a web page is first loaded and before you click on that link. Example a:link{color : maroon;} The color of not visited link using above css property is maroon. 2.   a: visited is state of a link after you click on that link. Example a:visited{color:navy;} The color of visited link is navy if it uses above css property. 3.   a:hover is state of a link when you keep mouse over it. Example a:hover{color:grey;} If the link uses above property then its color is grey when it is hovered. 4.   a:active is state of a link when it is being clicked. Example A:active{color:green;} The color of active link is green if it uses above property. Note: Always use this order when styling links: i)   a:link ii)   a:visited iii)   a:hover iv)   a:active
 Example  Here is an example that demonstrates styling of links using css.Observe various link states. To view it click here.