Forskellige farver på links
Hej eksperterJeg har brug for hjælp til at lave to forskellige farver links i to forskellige elementer. Jeg vil gerne have det til at blive defineret i et eksternt stylesheet, men jeg kan simpelthen ikke få det til. Hjælp! Jeg har siddet længe og prøvet at rode mig igennem, men jeg er temmelig ny i forhold til CSS, så jeg har brug for ekspertise. Menulinks skal være hvide, men de andre skal være sorte.
Mit stylesheet ser således ud:
body { background-color: #FFFFFF;
background-image: url("sailorpics/frontpic6.jpg");
background-repeat: no-repeat;
background-position: 200px 10px
}
#midt {
font-family: verdana, sans-serif;
color: #000066;
width: 670px;
height: 380px;
padding:10px;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #CCCCCC;
position: absolute;
top: 145px;
left: 200px;
font-size: 70%;
font-weight: bold;
font-variant: small-caps;
background-color: #fff;
}
#menustyle {
a:link {color: #FFFFFF; text-decoration:none;}
a:visited {color: #FFFFFF; text-decoration:none;}
a:hover {color: #FFFFFF; text-decoration:underline;}
a:active {color: #FFFFFF; text-decoration:underline;}
}
#menu {
font-family: arial, verdana, sans-serif;
color: white;
background-color: #990000;
padding: 6px;
border-style: solid;
border-width: 1px 4px 4px 1px;
border-color: #000000;
position: absolute;
top: 144px;
left: 110px;
width: 70px;
height: 95px;
font-size: 75%;
}
#textpics {
font-family: arial, verdana, sans-serif;
color: black;
background-color: #FFFFFF;
padding: 1px;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: #FFFFFF;
position: absolute;
top: 196px;
left: 305px;
width: 480px;
height: 300px;
font-size: 75%;
</style>
}
Og min HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Sea Punks - Links</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<p id="midt">Links</p>
<p id="menu">
<style type="text/css">
a:link {color: #FFFFFF; text-decoration:none;}
a:visited {color: #FFFFFF; text-decoration:none;}
a:hover {color: #FFFFFF; text-decoration:underline;}
a:active {color: #FFFFFF; text-decoration:underline;}
</style>
<a href="sejler.htm" title="Forside">::forside </a> <br>
<a href="info.htm" title="Lidt info om Sea Punks">::info </a> <br>
<a href="foto.htm" title="Billeder fra havet">::foto </a> <br>
<a href="ruter.htm" title="Beskrivelser af ruter">::ruter </a> <br>
<a href="links.htm" title="Links">::links </a> <br>
<a href="kontakt.htm" title="Kontakt Sea Punks">::kontakt </a>
</p>
<div id="textpics">
<a href="http://www.sydfynsbaadudlejning.dk/albincirrus.html" target="_blank"><b>Vores båd 2006</b></a> <br>
<b>Dansk Sejlunion</b>
</div>
</body>
</html>
