jochberger
Mitglied
Hi,
ich suche nach einer Lösung um auf der aktuell aufgerufenen Html-Seite per CSS den Link umzufärben und ein anderes Symbol vorne einzufügen.
Bei hover und so funktioniert das schon so wie ich das wollte.
Der Ausschnitt aus dem HTML:
Der betreffende Teil aus der CSS Datei:
Ich bin über jeden Tipp dankbar.
Lg
Jochberger
ich suche nach einer Lösung um auf der aktuell aufgerufenen Html-Seite per CSS den Link umzufärben und ein anderes Symbol vorne einzufügen.
Bei hover und so funktioniert das schon so wie ich das wollte.
Der Ausschnitt aus dem HTML:
HTML:
<ul>
<li><a href="index.html" class="aktuell">Startseite</a></li>
<li><a href="ueberuns.html">Über uns</a></li>
<li><a href="abhof.html">Ab-Hof-Verkauf</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
</ul>
HTML:
#nav ul li a:link {
background-color: #60180c;
color: #ffff00;
background-image: url(img/apfel_gelb.png);
background-repeat: no-repeat;
display: block;
height: 1,5em;
width: 150px;
margin-top: 8px;
margin-bottom: 8px;
margin-left: 2px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 35px;
text-decoration: none;
text-underline: none;
}
#nav ul li a:visited {
background-color: #60180c;
color: #ffff00;
background-image: url(img/apfel_gelb.png);
background-repeat: no-repeat;
display: block;
height: 1,5em;
width: 150px;
margin-top: 8px;
margin-bottom: 8px;
margin-left: 2px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 35px;
text-decoration: none;
text-underline: none;
}
#nav ul li a:hover {
background-color: #60180c;
color: #00ff00;
border-style: solid;
border-width: 3px;
border-color: #ffffff;
background-image: url(img/apfel_gruen.png);
background-repeat: no-repeat;
display: block;
height: 1,5em;
width: 150px;
margin-top: 8px;
margin-bottom: 8px;
margin-left: 2px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 35px;
text-decoration: bold;
text-underline: none;
}
#nav ul li a:visited {
background-color: #60180c;
color: #ffff00;
background-image: url(img/apfel_gelb.png);
background-repeat: no-repeat;
display: block;
height: 1,5em;
width: 150px;
margin-top: 8px;
margin-bottom: 8px;
margin-left: 2px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 35px;
text-decoration: none;
text-underline: none;
}
ul li a.aktuell {
background-color: #60180c;
color: #ff0000;
background-image: url(img/apfel_rot.png);
background-repeat: no-repeat;
display: block;
height: 1,5em;
width: 150px;
margin-top: 8px;
margin-bottom: 8px;
margin-left: 2px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 35px;
text-decoration: none;
text-underline: none;
}
Lg
Jochberger