CSS hulp gevraagd (opgelost)

Ok, ik heb even een beetje hulp nodig. Ik heb op 1 pagina zwarte en witte links nodig. Ik heb even geprobeerd dit met Dreamweaver te doen. Die maakt de links keurig de juiste kleur, maar ik wil graag dat de link oplicht wanneer je er met de muis overheen gaat. Hoe doe ik dat? Ik heb nu dus: [code:1:416f38f4bd] <style type="text/css"> <!-- .style1 {color: #FFFFFF; text-decoration: none} .style2 {color: #000000; text-decoration: none}


</style>
[/code:1:416f38f4bd]
Kan ik deze code er misschien op een of andere manier in verwerken?:

[code:1:416f38f4bd]
a:hover { font-family: verdana; color: #AAAAAA; text-decoration: none}
a:hover { font-family: verdana; color: #555555; text-decoration: none}
[/code:1:416f38f4bd]

Alvast bedankt.

.style1 a:hover {color: #FFF; text-decoration: none;} .style2 a:hover {color: #000; text-decoration: none;}

En dan zo gebruiken:

<span class=“style1><a href=”">bla</a></span>
<span class=“style2><a href=”">bla</a></span>

a:link {color: #333333; text-decoration: none} a:visited {color: #333333; text-decoration: none} a:hover {color: #FFFFFF; text-decoration: underline}

[quote:19812e069c="konijn"] <style type="text/css"> <!-- .style1 {color: #FFFFFF; text-decoration: none} .style2 {color: #000000; text-decoration: none} .style1 a:hover {color: #FFF; text-decoration: none;} .style2 a:hover {color: #000; text-decoration: none;}


</style>

<span class=“style1><a href=”">bla</a></span>
<span class=“style2><a href=”">bla</a></span>[/quote:19812e069c]

Dus zo?

[quote:ede1751f0d="Berend"]a:link {color: #333333; text-decoration: none} a:visited {color: #333333; text-decoration: none} a:hover {color: #FFFFFF; text-decoration: underline}[/quote:ede1751f0d]

Die heb ik inderdaad, alleen moet dat waarschijnlijk dus aan zo’n style worden toegepast.

[edit]Foute oplossing verwijderd[/edit]

Ik heb inmiddels hier de juiste oplossing gevonden:

[code:1:d9550f4364]
<html>
<head>
<style type="text/css">
.class1 A:link {text-decoration: none color: #FFFFFF;}
.class1 A:visited {text-decoration: none color: #FFFFFF;}
.class1 A:active {text-decoration: none color: #FFFFFF;}
.class1 A:hover {text-decoration: underline; color: #CCCCCC;}

.class2 A:link {text-decoration: none; color: #000000;}
.class2 A:visited {text-decoration: none; color: #000000;}
.class2 A:active {text-decoration: none; color: #000000;}
.class2 A:hover {text-decoration: none; color: #333333;}
</style>
</head>

<body>
ONE TYPE OF LINKS
<br>
<span class="class1">
<a href="http://www.yahoo.com">YAHOO</a>
<br>
<a href="http://www.google.com">GOOGLE</a>
</span>
<br>
<br>
ANOTHER TYPE OF LINKS
<br>
<span class="class2">
<a href="http://www.yahoo.com">YAHOO</a>
<br>
<a href="http://www.google.com">GOOGLE</a>
</span>
</body>
</html>
[/code:1:d9550f4364]

Dit lijkt me korter

[code:1:2bb0d3001e]
<a href="" class="style1">bla</a>
<a href="" class="style2">bla</a>
[/code:1:2bb0d3001e]

[code:1:2bb0d3001e]
<style type="text/css">
<!–
a.style1 {color: #FFFFFF; text-decoration: none} a.style2:hover {color: #FFF; text-decoration: none;}
a.style2 {color: #000000; text-decoration: none} a.style2:hover {color: #000; text-decoration: none;}

</style>
[/code:1:2bb0d3001e]

scheelt je weer een span

Als je de kleur van de links toch niet veranderren zou ik het zo doen:

[code:1:d5091cea48]
<style type="text/css">
<!–
a.style1:link,
a.style1:hover {
color: #FFFFFF;
text-decoration: none
}
a.style2:link,
a.style2:hover {
color: #000000;
text-decoration: none
}

</style>
[/code:1:d5091cea48]

@ Remco Vermeer

Klopt, maar ik heb als voorbeeld maar 2 links genomen terwijl er in het echt veel meer links komen. Die heb ik tussen de span gezet.

@ rburgt

kleur van de links veranderd wel.

Als je groepen links wilt maken kan je beter kiezen voor een HTML oplossing die meer recht doet aan het het feit dat ze gegroeperd zijn (en dus ook zonder CSS opmaak makkelijker herkenbaar zijn), door iedere groep als een ul-lijst weer te geven.

Aan de ul kan je een id hangen, waarmee je de kleuren voor iedere groep kan regelen.

ps: voor dat je met het argument komt dat iedereen tegenwoordig een browser met CSS ondersteuning heeft: ik heb sinds kort een Sony Ericsson K700i telefoon die een WAP2/XHTML browser heeft: die ondersteund CSS minimaal en heeft een klein schermpje, maar als de site goed in elkaar zit kan je er probleemloos mee surfen!