Mouseover bei Bildern????

html.de-Forum HTML, XHTML & CSS
1

Hallo zusammen!

Ich habe dieses Script im WWW gefunden…

a { display:block; background-image:url(button.gif); width:120px; height:30px } a:hover { background-image:url(button_on.gif); }

…Das Problem:
Was soll ich machen wenn ich mehrere Grafiken habe, da nicht bei jeder das selbe Bild angezeigt werden soll???

MfG
Alex

2

Lösung

Hab die Lösung selber schon gefunden… dieses Script.

Home 
    <style type="text/css">
          .mouseover1         { background:url(icons/home.png); width:256px;height:256px; }
          .mouseover1 a:hover { background:url(icons/home_mouseover.png); }
    </style>
    <style type="text/css">
          .mouseover2         { background:url(icons/chat.png); width:256px;height:256px; }
          .mouseover2 a:hover { background:url(icons/chat_mouseover.png); }
    </style>
    <style type="text/css">
          .mouseover3         { background:url(icons/download.png);; width:256px;height:256px; }
          .mouseover3 a:hover { background:url(icons/download_mouseover.png); }
    </style>

Neues Problem…
die Symbole sind untereinander angeordnet, obwohl nirgendwo
steht.
Wie löse ich das Problem?

3

Mit float:left; kannst du sie Horizontal ordnen.

Mfg lukiB

4

Entschuldigung, aber das versteh ich nicht so-bin nicht der css-star kannst du mir bitte zeigen was su meinst?
-danke

5

Oder meinst du so…

Home .mouseover1 { background:url(icons/home.png); width:256px;height:256px; } .mouseover1 a:hover { background:url(icons/home_mouseover.png); } .mouseover2 { background:url(icons/chat.png); width:256px;height:256px; } .mouseover2 a:hover { background:url(icons/chat_mouseover.png); } .mouseover3 { background:url(icons/download.png); width:256px;height:256px; } .mouseover3 a:hover { background:url(icons/download_mouseover.png); }

…aber dann werden die symbole so angeordnet…

12
3
---------problemo-----------------