Verschiedene Farben für a:link, a:hover etc
0 0 0 
Dennis
Verschiedene Farben für a:link, a:hover etc
Hallo,
ich tüftle jetzt schon geraume Zeit an dem Problem, meine Links per CSS an verschiedenen Stellen verschiedene Farben etc. zuzuweisen. Das klappt soweit auch gut, nur scheine ich da ein generelles Verständnisproblem zu haben. Wie ihr dem folgendn Quellcode entnehmen könnt, habe ich UL, li, a:link etc in der Klasse .nav1 bestimmt. Klappt auch. Bei der id #middle habe ich das auch getan, klappt auch. Jedoch wird der a:active Zustand aus der Klasse .nav1 übernommen. wie kann das möglich sein? Das ist auch der Fall, wenn ich alle #middle ID's einfach herausnehme.
Ich bin davon ausgegengen, dass die Linkfarben auch nur in der Klasse .nav1 zum tragen kommen.
Definiere ich jetzt in der #middle a:active { background-color: transparent}, dann geht es.
Bitte helft mir auf dioe Sprünge
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>TARA Verantstaltungen - Seminare, Vorträge, Workshops, Esoterik</title>
<link rel="shortcut icon" type="image/x-icon" href="images/button/favicon.ico">
<style type="text/css">
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
background-color: #fdd333;
margin: 0;
}
#nav_container_1 {
width: 125px;
margin-top: 7px;
margin-left: 23px;
background-image: url(images/images_layout/nav_cont1.jpg);
background-repeat: repeat-y;
}
.nav1 ul {
margin: 0;
padding-left: 0px;
list-style-type: none;
}
.nav1 li {
position : relative;
float : left;
width: 98%;
padding-left : 1px;
padding-right : 1px;
}
.nav1 li a{
display : block;
padding-left : 0.2em;
padding-top : 0.2em;
padding-bottom : 0.2em;
color : #990000;
text-decoration : none;
border-top : 1px solid #fae390;
border-bottom : 1px solid #d7b84b;
font-weight: normal;
font-size: 0.7em;
line-height : 1em;
}
.nav1 li a:link, a:visited {
width: 99%;
text-decoration : none;
}
.nav1 li a:hover, a:active {
background-color : #faeedc;
}
#middle a{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
font-weight: bold;
text-decoration: none;
}
#middle a:link, a:visited {
color:#666600;
}
#middle a:hover, a:active {
color:#33FF00
}
</style>
</head>
<body>
<div id="nav_container_1">
<table class="nav1" border="0" cellspacing="0" cellpadding="0">
<tr>
<th>TARA</th>
</tr>
<tr>
<td><ul>
<li><a href="#" target="_self">Alle Veranstaltungen</a></li>
<li><a href="#" target="_self">Vorträge</a></li>
<li><a href="#" target="_self">Workshops</a></li>
<li><a href="#" target="_self">Seminare</a></li>
<li><a title="Tara Kurse" href="#">Kurse</a></li>
<li><a title="Tara nnuddel" href="#">knuddel</a></li>
</ul></td>
</tr>
</table>
</div>
<table id="middle" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top"><p>Text</p>
<ul>
<li><a href="#">LSITENELEMENT1</a></li>
<li><a href="#">nummer 2</a></li>
<li><a href="#">nummer 3</a></li>
</ul>
<p>Hallo Ronald, hier ein weiter Versuch, ging auch nicht bei einer Kollegin. </p>
<p>Hier Textänderung: <a href="#">xx Galerie </a>Uwe LInke, xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
<p> Xact Atelier xxxxxx</p>
</tr>
<tr><td><center><a href="#top" target="_self">⇑ top ⇑</a></center></td></tr>
</table>
</body>
</html>
-
Hallo,
klarer wird das, wenn man Teile etwas anders formatiert:
.nav1 li a:hover, a:active { background-color : #faeedc; }und später:
#middle a:hover, a:active { color:#33FF00 }Wird’s klarer?
Gruß
OlafP.S.: Wofür sind die Tabellen?
-
NEin,
sorry, aber ich weiss nicht was Du mir erklären möchtest.
Gruß
Ronald-
Hi Ronald,
sorry, aber ich weiss nicht was Du mir erklären möchtest.
.nav1 li a:hover, a:active { background-color : #faeedc; }Dieser Code ist gleichbedeutend mit:
.nav1 li a:hover { background-color : #faeedc; } a:active { background-color : #faeedc; }Jetzt verstanden? ;-) Wenn nein, dann beschäftige dich noch mal mit Selektoren in CSS und Verkettung selbiger.
Viele Grüße,
~ Dennis.-
Jou, jetzt habe ich's geschnallt, danke.....
Nur um ganz sicher zu gehen:
Wäre folgende Schreibweise Schreibweise legitim?.nav1 li a:link, .nav1 li a:visited {
width: 99%;
text-decoration : none;
}Gruß
Ronald-
Hallo,
Wäre folgende Schreibweise Schreibweise legitim?
.nav1 li a:link, .nav1 li a:visited {
Ja, das wäre sie.
Gruß
Olaf
-
-
-
-