Zur Navigation

Zweite Linkfarbe wird im Chrome nicht dargestellt

1 krieger98

Ich bin dabei meine Webseiten für 2015 zu überarbeiten und dabei möchte ich in Zukunft zwei Linkfarben verwenden. Auf der Linken-Navigation und im Seiteninhalt sollen die Standard Linkfarben (Blau) verwendet werden und in der obigen Navigationleiste (Schwarz).
Ich habe dafür eine CSS Datei erstellt.
Im Internet-Explorer und im Firefox werden die Farben richtig dargestellt nur im Chrome nicht (nur die Standard Farbe-Blau).
Die CSS-Datei sieht wie folgt aus:
Navigation a:link ist für die obige Navigation leiste.
.navigation a:link {color: #000000; font-weight: bold; line-height: 25px; font-size: 12px; font-family: Tahoma, Verdana;  letter-spacing: normal; word-spacing: normal; }
a:link { 	font-size: 11px; font-family: Tahoma, Verdana; text-decoration: none; font-weight: bold; color: #000099; }
a:visited { font-family: Tahoma, Verdana; font-size: 11px; text-decoration: none; font-weight: bold; color: #000099; }
a:hover { font-family: Tahoma, Verdana; font-size: 11px; text-decoration: none; font-weight: bold; background-color: #0099FF;
a:active { font-family: Tahoma, Verdana; text-decoration: none; font-weight: bold;background-color: #0099FF; }
Die schwarze Navigations-Farbe wurde folgender Maßnahmen eingebunden:
<div id="navi_kopf"class="navigation">
<a href="Tipps.htm" target="_top">» Home</a>
<a href="Alleseiten_menue.html">» Sitemap</a>
<a href="Impress-kh.htm">» Impressum</a> 
<a href="Feedback.htm">» Kontakt</a> </div>

Hat einer eine Idee woran es liegen könnte

[Edit Jörg: zur besseren Lesbarkeit Codeblöcke eingefügt]

31.08.2014 16:53 | geändert von Jörg: 31.08.2014 17:22

2 Jörg

In dieser Zeile fehlt die schließende Klammer:

a:hover { font-family: Tahoma, Verdana; font-size: 11px; text-decoration: none; font-weight: bold; background-color: #0099FF; }

... vielleicht stolpert Chrome da schon drüber

Außerdem würde ich hier noch ein Leerzeichen zwischen id und class Attribut einfügen:

<div id="navi_kopf" class="navigation">

31.08.2014 17:26

3 krieger98

Zitat von Jörg
In dieser Zeile fehlt die schließende Klammer:

a:hover { font-family: Tahoma, Verdana; font-size: 11px; text-decoration: none; font-weight: bold; background-color: #0099FF; }

... vielleicht stolpert Chrome da schon drüber

Außerdem würde ich hier noch ein Leerzeichen zwischen id und class Attribut einfügen:

<div id="navi_kopf" class="navigation">

Das mit der Klammer war ein Übertrags-Fehler und ist in der Datei richtig dargestellt. Das mit dem Leerzeichen habe ich probiert hat aber nichts gebracht.

31.08.2014 19:32

4 Jörg

Du hast oben nur ".navigation a:link" definiert - also die Links innerhalb von .navigation, die noch nicht besucht worden sind. Wenn der Link besucht wurde, käme stattdessen eine Definition zum Selektor ".navigation a:visited" zum Zuge, die bei dir aber fehlt. Deswegen verwendet der Browser die generische Definition zu "a:visited". Möglicherweise hast du die verlinkte Seite in Chrome bereits besucht, so dass der Link dort blau erscheint.

31.08.2014 20:13 | geändert: 31.08.2014 20:14

5 krieger98

Zitat von Jörg
Du hast oben nur ".navigation a:link" definiert - also die Links innerhalb von .navigation, die noch nicht besucht worden sind. Wenn der Link besucht wurde, käme stattdessen eine Definition zum Selektor ".navigation a:visited" zum Zuge, die bei dir aber fehlt. Deswegen verwendet der Browser die generische Definition zu "a:visited". Möglicherweise hast du die verlinkte Seite in Chrome bereits besucht, so dass der Link dort blau erscheint.

Vielen Dank das war der Fehler !!

31.08.2014 22:07

Beitrag schreiben (als Gast)





[BBCode-Hilfe]