nicht angemeldet
Hallo
Ich habe grade den Artikel über Mouseover-Buttons und -Effekte mit CSS gelesen. (http://aktuell.de.selfhtml.org/artikel/css/mouseover/#a4) Dabei habe ich ein Problem: Ich habe eine exotische Schriftart in einem Menü verwendet. Um mouseover-Effekte zu realisieren hatte ich bisher in solchen Fällen immer Java-Script verwendet. Offenbar geht das aber auch über CSS.... Nur steht nicht drin wie genau.
Da steht:
"...Wenn verschiedene Rollovereffekte für verschiedene Buttons gewünscht sind, etwa in einer Menüleiste, dann kann man anstatt a:hover auch #button1:hover oder ähnliches schreiben, um zwischen den Buttons mit Hilfe des id-Attributs zu unterscheiden...."
Wie genau greife ich dann über die id auf den Button zu? Ich habe schon alles Mögliche probiert, aber bis jetzt klappts ned. Auch ausführliches Googeln hat nichts gebracht, weil überall nur die Methode für die Änderung von a (bzw. a:hover) drinsteht, was mir allerdings nichts bringt, weil ich ja 6 verschiedene buttons/hovers brauche.
Hier mein Menü:
<html>
<head>
<title>menu</title>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
<style>
#willkommen { background-image:url("s_pix/B_Willkommen.png");}
#willkommen:hover { background-image:url("s_pix/B_WillkommenLight.png");}
</style>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0" height="95%">
<tr>
<td align="left" valign="top">
<a class="willkommen" target="content" href="../content/news.htm"></a> // <-Das funktioniert so nicht....
<a class="menu" target="content" href="../content/news.htm">Willkommen</a>
<a class="menu" target="content" href="../content/schwert.htm">Der Weg des Schwertes</a>
<a class="menu" target="content" href="../content/magie.htm">Der Weg der Magie</a>
<a class="menu" target="content" href="../content/heiler.htm">Der Weg des Heilens</a>
<a class="menu" target="content" href="../content/bilder.htm">Bilder</a>
<a class="menu" target="content" href="../content/links.htm">Links</a>
<img src="s_pix/B_Willkommen.png">
</td>
</tr>
</table>
<table align="center" valign="bottom">
<tr><td><a href="info.htm" target="content">info</a></td></tr>
</table>
</body>
</html>