Step 2. ) Using the pseudo-class elements to style navigation

a:link	a:visited	a:focus		a:hover		a:active

Role your mouse over the menu items on the left. The possibilities a many...

#nav li {
	font-weight: bold; 
	height: 24pt;
	}
#nav 	{
		list-style-type: none;
		}   
#nav a:link {
			color: green;
			text-decoration: none;
			}
#navgation a:visited {
	color:purple;
	}
#navigation a:hover 
	{color:blue;
	font-style: italic;
	}
#navigation a:active {
	 color:red;
	 }
ul#nav li#here a { background-color: #09f; }	 
	 

The HTML

<!-- Start Navigation -->

<ul id="nav">
<li><a href="">Home</a></li>
<li><a href="../lesson1.html"> Lesson 1</a></li>
<li><a href="../Lesson 3.html">Lesson 3</a></li>
<li><a href ="../lesson3#Fonts">Fonts</a></li>
<li><a href = "mailto:garry@uoftgs.com">Contact</a></li>
<li><a href = "../Formstest/about.html">About</a></li>
</ul>





<!-- End Navigation -->

</div>

<!-- end left column -->