Creating a different rollover for an href using a class

Here are a couple of ways of creating a different rollover effect for an href link.

Method 1 using a class

<style type=”text/css”>
a.leftLink
{
color: #00f;
text-decoration: none
}

a.leftLink:hover
{
color: #f90;
text-decoration: underline
}
</style>

and this is used as follows :

<a href=”#”>This is a link</a>

or

Method 2 using a class in a div

and this is used as follows :

<style type=”text/css”>
.leftLink { margin-top:5px;margin-bottom:5px;font-size:small; }
.leftLink a { color:White; }
.leftLink a:hover { color:#ff9933; }
</style>

<div><a href=”#”>This is a link</a></div>