Set Link Colours with CSS

From the Document and Text Colours material from the Basic HTML5 notes:

Common link colours used by default in browsers:

Defining Colours for Link States:

The order of the CSS lines below is very important. Do not change the order in which the various link state CSS rules are listed (the reasons for the order will become clearer when we discuss more about the cascade of Cascading Style Sheets).

a:link {color: #0000FF;}
a:visited {color: #990099;}
a:focus {color: #66CCFF;}
a:hover {color: #66CCFF;}
a:active {color: #FF0000;}
/* Comment Explanation of Link States:
a:link - a link that has not been visited
a:visited - a visited link
a:focus - the link currently selected with the keyboard
a:hover - a link when your mouse is rolled over it
a:active - a link you are holding your mouse down on
*/

Example of Adding Link Colours into CSS Style Tags:

<style>

   body
   {
	background-color: #eeeeee;
	font-family: Helvetica, Arial, sans-serif;
	font-size: small;
	color: #000066;
   }
   
   a:link {color: #0000FF;}
   a:visited {color: #990099;}
   a:focus {color: #66CCFF;}
   a:hover {color: #66CCFF;}
   a:active {color: #FF0000;}
   
   /* Optional Comment explanation/reminder of link states:
     a:link  - a link 
     a:visited  - a visited link
     a:focus  -  the link currently selected with the keyboard
     a:hover  -  a link when your mouse is rolled over it 
     a:active  -  a link you are holding your mouse down on 
   */

</style>