verschiedene linkfarben mit css formatieren??

rogerle · 15.12.2006, 16:17

Hallo

habe mal eine Frage.
Ich habe eine html Seite erstellt.Da ist ein Hintergrundbild. Unten ist es rot(in diesem roten bereich sind ein paar links) oder so ähnlich. Oben ist es ziemlich hell,weiss eigentlich. Da habe ich mein Navimenü in Form von einfachen Textlinks gemacht.
Im basic.css habe ich angegeben, welche Farbe die links haben sollen, weil in dem roten bereich unten sich die links farblich abheben müssen um deutlich gesehen zu werden.
Ich möchte nun das die Navigationslinks eine andere Farbe haben.Nun habe ich ja für die ganze Seite die Linkfarbe aber schon eingestellt. Kann man diesen links per css anweisen das die Navigationslinks farblich anders dargestellt werden,,das man diese 5 navigationslinks von der Anweisung des basic.css ausschließt??

Mit freundlichen Grüßen
Rogerle

ein unwissendes schäfchen

UweB · 15.12.2006, 17:38

Hallo Roger,
Um Links auf einer Seite unterschiedlich zu formatieren, musst du keinen Bereich aus deiner basic.css ausschließen. Das geht auch gar nicht.

Zwei Lösungen fallen mir für deine Problem ein:

Lösung 1
Du ordnest einzelnen Links Klassen zu
Bisher steht in der CSS Datei
a {...}
a:hover {...}
...

nun ergänzt du das um
a.meineErsteKlasse {...}
a.meineErsteKlasse:hover {...}
a.meineZweiteKlasse {...}
a.meineZweiteKlasse:hover {...}

Jetzt musst du nur noch den Links auf deiner Seite die gewünschte Klasse zuordnen.

Da aber in deinen Fall alle Links, die die gleiche Farbe haben sollen, zusammen stehen, also z.B. im Navi-Bereich, sollte Lösung 2 besser passen:

Lösung 2
Du legst alle Links, die zur oberen Navigation gehören sollen, in ein DIV-Element, dem du eine ID zuweist, z.B. id="naviOben".
in diesem Fall schreibst du in die CSS-Datei:
#naviOben a {...}
#naviOben a:hover {...}
...

Beide Lösungen lassen sich auch kombinieren:
#naviOben a.meineKlasse {...}
...

Gruß
Uwe

rogerle · 15.12.2006, 19:36

Hallo Uwe,
erst mal Danke für deine Antwort!!
Ich bin ein Anfänger was das mit css betrifft. Werde nicht so recht schlau daraus. Hier ist mal das was ich gemacht habe.

body { color: black; background-color: white; }
<div id="#naviOben" {a }
{
#navioben a:link { color: #0B0B0B ; }

#navioben a:visited { color: #DDDDDD }

#navioben a:hover { color: #555555 }

#navioben a:active { color: #0B0B0B }>

<div/>
p {}
td {}

a:link { color: #ffeb7f ; }

a:visited { color: #ffeb7f }

a:hover { color: #ff0 }

a:active { color: #ffeb7f }

Kenne mich damit nicht so aus. In deiner Mail schreibst du das ich die Links erst mal im css anlegen soll.....naja wie und wo schreibe ich das den hin?
Wäre echt nett wenn du mir das zeigen könntest!

MFG Roger

MatthiasG · 15.12.2006, 20:35

Zitat:

Zitat von rogerle

....naja wie und wo schreibe ich das den hin?
Wäre echt nett wenn du mir das zeigen könntest!

oha, für die CSS-Definition gibt es den css-Editor in GL.
Hier siehst du, wie "die Linkfarben" angelegt werden. Laß dich nicht beirren, auch wenn die Ansichten schon von einer älteren GL Version sind. Das Grundprinzip ist das gleiche.

Gruß
Matthias

rogerle · 21.12.2006, 12:14

Hallo Uwe,
habe es noch nicht geschafft das hinzubekommen....
Ich habe mal das was im css steht hier.

body { color: black; background-color: white; }
<div id="navibereich">
#naviOben a {kommt hier der Link hin???}
#naviOben a:visited {hier die Farbe???}
#naviOben a:hover {...}
#naviOben a:active {...}

</div> 
td {}

a:link { color: #ffeb7f ; }

a:visited { color: #ffeb7f }

a:hover { color: #ff0 }

a:active { color: #ffeb7f }

Kann ich das mit dem Div so stehen lassen??
Ich habe 5 navilinks. Muss ich das div jetzt 5 mal wiederholen, also die links zuweisen im #naviOben a {kommt hier der Link hin???}??

so so sieht das im html aus
<a href="file:///D:/rogers_mind/home.html">Home</a></div>
<div style="position:absolute;top:0px;left:192px;width:66px;height:32px;-adbe-c:c">
Muss ich da was ändern? Oder die anweisung da mit hinein schreiben??
Wäre nett wenn du mir helfen könntest!!
Dankeschön!!
Weihnachtliche Grüße an alle.

Roger

UweB · 21.12.2006, 14:06

Hallo Roger,
du hattest oben geschrieben, dein Projekt hat bereits eine basic.css. Daher war ich davon ausgegangen, dass du gewisse Grundkenntnisse in CSS hast. Meine "Anleitung" war entsprechend kurz gefasst.

Einfach ausgedrückt ist das alles falsch, was du da machst. Wenn ich später Zeit habe, erkläre ich dir das genauer. Im Moment geht es leider nicht...
Solltest du Zeit haben empfehle ich dir dich mal ein wenig in CSS einzulesen.
Hier zwei gute Quelle:
http://www.css4you.de
http://aktuell.de.selfhtml.org/

Gruß
Uwe

rogerle · 21.12.2006, 14:25

Ok dankeschön

Mfg Roger

UweB · 21.12.2006, 20:27

Hallo Roger,
sieh dir bitte dieses Beispiel an. Beachte bitte auch den Quellcode und die CSS-Datei.
Ein Menü würde ich zwar eigentlich in Form einer Liste anlegen, aber hier geht es ja nur um die unterschiedliche Formatierung der Links im Text, im Menü und einen Menüpunkt mit eigener Darstellung.
Im Text ist ein blauer Link, der bei MouseOver seinen Farbton verändert.
Im Menü sind die Links schwarz und bei MouseOver unterstrichen.
Der letzte Menüpunkt ist gelb.

Vergleiche das Beispiel bitte mit meiner Beschreibung oben.
Ich hoffe das hilft dir weiter. Und wenn du etwas nicht verstehst, weiter fragen...

Gruß
Uwe