a:link - Zwei Typen von Links

[Peter S. Drössler]

Ich habe folgendes in meinem Head notiert:

<style type="text/css">
a:link { text-decoration:none; color:#FFFFFF }
a:visited { text-decoration:line-through; color:#734287; }
a:hover { text-decoration:underline; color:#234764; }
a:active { text-decoration:underline; color:#348364; }
</style>

Nun habe ich weiße Links (logiserweise!). Was muss ich jedoch tun, wenn ich auch noch beispielsweise andersfrabige Links mit einem anderen oder demselben Hover-effekt oder anderes haben will. Und dies in Ergänzung zu dem oben gesehenen.

Wie kann ich den obigen Text "splitten" in zwei verschiedenfarbige Linktypen????

[Sven Rautenberg]

Moin!

Wie kann ich den obigen Text "splitten" in zwei verschiedenfarbige Linktypen????

Schau dir mal das hier an - es beantwortet deine Frage genau: [pref:t=84468&m=495216]

- Sven Rautenberg

[Fabian St.]

Hi!

Wie kann ich den obigen Text "splitten" in zwei verschiedenfarbige Linktypen????

Beschäftige dich mal mit Klassen!
Link: http://de.selfhtml.org/navigation/css.htm#zentrale_formate
Grüße,
Fabian St.

[Marc]

Moin moin> Ich habe folgendes in meinem Head notiert:

<style type="text/css">
a:link { text-decoration:none; color:#FFFFFF }
a:visited { text-decoration:line-through; color:#734287; }
a:hover { text-decoration:underline; color:#234764; }
a:active { text-decoration:underline; color:#348364; }
</style>

Nun habe ich weiße Links (logiserweise!). Was muss ich jedoch tun, wenn ich auch noch beispielsweise andersfrabige Links mit einem anderen oder demselben Hover-effekt oder anderes haben will. Und dies in Ergänzung zu dem oben gesehenen.

Wie kann ich den obigen Text "splitten" in zwei verschiedenfarbige Linktypen????

Oft stehen die unterschiedlich gestalteten Links dann auch in unterschiedlichen Bereichen der HP. Die kann man in divs definieren:

<div id="Hauptnavigation">
  <a href="#">1. Link</a>
  <a href="#">2. Link</a>
  <a href="#">3. Link</a>
</div>

<div id="content">
  <p>blablablabla blablabla blabla <a href="#">Link im Fliesstect</a>
</div>

<div id="kontextmenu">
  <a href="#">1. Link</a>
  <a href="#">2. Link</a>
  <a href="#">3. Link</a>
</div>

In der CSS-Datei legst Du einmal fest (wie von Dir gemacht), wie Links generell aussehen sollen.

DANACH schreibst Du nur die Abweichnungen von diesem Standard wie folgt:

#Hauptnavigation a {
  color:#666; usw...
}

#content a {
  color:#800; usw...
}

#kontextmenu a {
  color:#0f0; usw...
}

#kontextmenu a:visited {
  color:#00f; usw...
}

Dadurch erhalten beispielsweise alle Links im Bereich Hauptnavigation eine graue Farbe, im Contenbereich (also im Fließtext) erscheinen sie dunkelrot und im Kontextmenü grün.

Besuchte Links im Kontentbereich sind blau.

Außerdem kannst Du natürlich auch noch belibige viele andere Bereiche dfieniren (ist aber wenig sinnvoll).

Gruß,
Marc.

[Marc]

Moin moin!

<style type="text/css">
a:link { text-decoration:none; color:#FFFFFF }

[...]

</style>

Nun habe ich weiße Links (logiserweise!).

Übrigens solltest du gerade bei weißen Links (aber eigentlich immer) auch eine Hintergrundfarbe definieren!!!

Gruß,
Marc.