a:hover problemer
Jeg er ved at lave en hjemmeside og jeg har nogle knapper jeg gerne vil lave en hover effekt på.Knapperne er lagt ind som jpg billeder og har hver deres div ID, jeg ved dette ikke er den optimale løsning men den tid den sorg.
Jeg kunne godt tænke mig at knapperne blev skiftet ud med et andet når musen kørte over dem, og jeg har fundet ud af at jeg skal bruge a:hover i css, men jeg kan ikke rigtig finde ud af det.
Er der nogen der kan hjælpe?
HTML (forsiden):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Billund Limosine Service</title>
<link rel="stylesheet" type="text/css" href="cssdokument.css" />
</head>
<body>
<div id="A">
<center><img src="Grafik/Skitse.jpg" alt="Skitse" /></center>
</div>
<div id="H">
<p>
Velkommen på Billund Limousine Services hjemmeside, hvor vi håber, De kan hente inspiration.<br />
Siden indeholder oplysninger om, hvilke biler vi kan tilbyde, priser og meget mere.<br />
<br />
Billund Limousine Service blev startet i 1992 af Tommy Søgaard.<br />
Lige siden starten har ideen været at sætte kunden i centrum og bevare den faglige stolthed. Det gør, at vi i dag kan tilbyde områdets bredeste udvalg inden for limousine-kørsel.<br />
<br />
Kig dig omkring og drøm dig ind i en verden af luksus.<br />
<br />
Vi er at træffe på telefon 75 35 37 77 dagligt fra klokken 07.00 - 08.30
<br />og igen fra klokken 17.30 - 22.30.<br />
<br />
Ved akut behov for kørsel kan Tommy Søgaard træffes på mobiltelefon 40 50 37 77<br />
<br />
Forespørgelser og bestillinger modtages gerne på mail : post@billund-limo.dk<br />
De er også velkommen til at skrive eller faxe til os :<br />
<br />
Billund Limousine Service<br />
Kobjergvej 13<br />
DK - 7190 Billund<br />
Telefax 75 35 38 88 <br />
</p>
</div>
<div id="B">
<a href="index.html">
<img src="Grafik/forsideknap aktiv.jpg" alt="Forside" border="0px" />
</a>
</div>
<div id="C">
<a href="korselaf.html">
<img src="Grafik/korselafknap.jpg" alt="Korselaf" border="0px" />
</a>
</div>
<div id="D">
<a href="nyheder.html">
<img src="Grafik/nyhederknap.jpg" alt="Nyheder" border="0px" />
</a>
</div>
<div id="E">
<a href="lufthavnskorsel.html">
<img src="Grafik/lufhavnskorselknap.jpg" alt="Lufhavnskorsel" border="0px" />
</a>
</div>
<div id="F">
<a href="biler.html">
<img src="Grafik/bilerknap.jpg" alt="Biler" border="0px" />
</a>
</div>
<div id="G">
<a href="bilsalg.html">
<img src="Grafik/bilsalgknap.jpg" alt="Bilsalg" border="0px" />
</a>
</div>
</body>
</html>
CSS:
@charset "utf-8";
/* CSS Document */
body{
background-color:#393939;
}
h1{font-family:Verdana, Arial, Helvetica, sans-serif;
}
p{font-family:Arial, Helvetica, sans-serif;
}
#H{
margin-left:380px;
margin-top:-560px;
float:left;
height: 490px;
width: 650px;
position:absolute;
overflow: auto;
color:#000000;
text-align:left;
}
#B{position:absolute; top:172px; left:366px;
}
#C{position:absolute; top:172px; left:479px;
}
#D{position:absolute; top:172px; left:593px;
}
#E{position:absolute; top:172px; left:706px;
}
#F{position:absolute; top:172px; left:819px;
}
#G{position:absolute; top:172px; left:933px;
}
#I{position:absolute; top:210px; left:485px;
}
#J{position:absolute; top:210px; left:599px;
}
#K{position:absolute; top:210px; left:712px;
}
#L{position:absolute; top:210px; left:825px;
}
Billed af forsiden:
http://peecee.dk/upload/view/137713