olika länk hover i samma dokument

hejsan,

kan man lösa så att a klassen kan anta olika värden?

dvs jag har en tabellsida med meny till höger och där vill jag att länkarna ska få en färg när man har musen över, men jag vill att länkarna ska få en annan färg när musen är över på resten av sidan.

jag inkluderar en css mall och jag är van vid att skriva typ:

a {
	font-family: Verdana, Arial, Helvetica, sans-serif;

	color: 01698C;
	font-weight: plain;
	text-decoration: none;
}
a:link {
	color: 01698C;
	font-weight: plain;
	text-decoration: none;
}
a:visited {
	color: 01698C;
	font-weight: plain;
	text-decoration: none;
}
a:hover {
	color: FFFFFF;
	font-weight: plain;
	text-decoration: none;
}
a:active {
	color: 01698C;
	font-weight: plain;
	text-decoration: none;
}

hur gör man om man vill ha mer än en variant?

/E

Om din meny ser ut såhär:

<div id="meny">
<a href="#">Ett</a>
<a href="#">Två</a>
<a href="#">Tre</a>
</div>

Så kan du skriva din CSS såhär:

/* grundutseende på länkar */
a { .... } 
a:link { ... }
a:visited { ... }
a:hover { ... }
a:active { ... }
/* Länkar i menyn */
#meny a { .... } 
#meny a:link { ... }
#meny a:visited { ... }
#meny a:hover { ... }
#meny a:active { ... }

Och om din meny är uppdelad på flera ställen på sidan,dvs om du behöver köra med class istället för id t.ex. såhär

<div class="meny">
<a href="#">Ett</a>
<a href="#">Två</a>
<a href="#">Tre</a>
</div>

Så kan du skriva din CSS såhär:

/* grundutseende på länkar */
a { .... } 
a:link { ... }
a:visited { ... }
a:hover { ... }
a:active { ... }
/* Länkar i menyn */
.meny a { .... } 
.meny a:link { ... }
.meny a:visited { ... }
.meny a:hover { ... }
.meny a:active { ... }

Ge dina länkar en klass

a.foo:hover {
	color: #f00;
}

...

<a href="#" class="foo">bar</a>

/r så var man lite efter igen ja.