HTML/CSS: mehrere linkfarben auf einer seite
 

hallo, ihr da draußen, brauche hilfe.
ich bastle grad eine art gästebuch das mit jedem eintrag die hintergrundfarbe des eintrages und auch die schriftfarbe wechselt. blos mit den links will mir das nicht gelingen.


so klappts nicht...

<div style="background-color:#FF0000;
color:#00FF00;
a:link {color:#0000FF;}">
ein textund ein link
</div>


...hat jemand einen besseren vorschlag? würde mich sehr freuen.

Links mit CSS
 

am elegantesten ist die lösung mit einer externen css datei. wenn du allerdings nur eine hoverlinkformatierung benötigst reicht es wenn du in den head einträgst:

<style type="text/css">
<!--
a:link {
color: #000000; /// der link selber
}
a:visited {
color: #000000; /// ein bereits besuchter link
}
a:hover {
color: #FF0000; /// der hover-link
}
a:active {
color: #000000; /// der gerade aktive link
}
-->
</style>

die kommentare brauchst du natürlich nicht einzutragen.
das ganze kommt dann vor den abschließenden </head> tag.

Re: Links mit CSS
 

...naja das klappt sicher, aber ich will ja auf einer seite zwei (oder mehr) verschiedene linkfarben. mit deiner lösung ändert sich zwar die linkfarbe, aber eben für die ganze seite. gibt es keine möglichkeit die links nur für einen bestimmten abschnitt zu ändern? es würde mir auch helfen wenn man deine lösung einer bestimmten stylesheet-klasse zuweisen könnte. denn dann könnte ich den gewünschten abschnitt mit dieser klasse formatieren. danke trotzdem wiking

Re: Re: Links mit CSS
 

wie wäre es mit class...ordne eben deinen links klassen zu, dann kannst soviele versch haben wie du magst...

wenn du das ganze dynamischen machen willst, wirst dus irgendwie ausprogrammieren... wenn dus eh programmierst, hätt ich gsagt du hast eine schlatvariable, sagen wir du schaltest zwischen zwei Farben hin und her, dann speicherst du dir die beiden Farb-CSS-Versionen getrennt ab und lädst entsprechend der schaltvariable die datei rein... kA ob das geht, so könnts ich mir vorstellen (aber ich mach eigentl keine Webprogrammierung, aber vielleicht is das ein ansatz) ;)

PredeX

...ich glaub das wird nicht klappen, weil ich die css datei ja im header dazuladen muß, oder? deshalb kann ich ich nicht text ausgeben - cssdatei laden - text ausgeben - usw.. ich muß das irgendwie "inline" in der html datei schaffen. ich bräuchte irgendwie eine htmllösung des problemes dann kann ich das ganze in php übertragen.

wie schon gesagt wurde, du machst dir mehrere klassen, und den anchor-tags weißt du dann per zufall (oder nach dem farbgebungs-system wenn du sowas hast) die entsprechende klasse zu.

...ja hört sich gut an, aber wie kann ich in die linkfarbendefinitionen in eine css-klasse einhängen. bitte um ein syntaxbeispiel - bei mir klappt das nämlich nicht, hoffentlich bin ich nur zu blöd dafür und das klappt tatsächlich irgendwie.

ich habs bisher nur mit schriftgrößen gemacht und kann nicht sagen obs mit link-farben auch funzt.

eine klasse definieren:

<quote>

[datei.css]
....
.klassenname {font-size:14px;......}
....

</quote>

und dann einem z.b.absatz in der html datei eine classe zu orden

<p class=klassenname>blabla</p>

sonst schau mal bei selfhtml

das stylesheet:

die links:


du kannst die a:active, ...... definitionen natürlich auch weglassen, aber wenn du etwas anderes als die farben für die links festlegen willst, dann kannst du es so machen. wichtig: wenn du die a:link, ...... definitionen machst, dann schreib dort nix von der farbe rein, obwohl, wenn du die klassendefinitionen nach den a:link, ...... machst, werden die farben der a-definitionen ignoriert, und die klassendefinitionen werden genommen (vorrausgesetzt du schriebst beim lnik die klasse rein). hui, kompliziert zu beschreiben, aber so müsste es gehen.

moorhahn ...das schaut sich gut an. so könnte es klappen. werds heute nacht probieren und mich nochmal melden. vielen dank allen darweil.

so klappt es.
irgendwie ist das allerdings eine eine hässlich krücke, weil jedem link die klasse mit der farbdefinition zugewiesen werden muß. und außerdem besuchte links nicht mehr andersfarbig dargestellt werden. aber ich will mich zufrieden geben.
danke für eure vorschläge allesamt, insbesondere dir mohrhahn.

das problem mit den bereits besuchten links lässt sich lösen: schreib unter die klassendefinitionen einfach noch die a:visited- (und gegebenenfalls auch die a:active-) definitionen.

also ungefähr so:

.linkfarbe1 {......}
.linkfarbe2 {......}
a:visited {color: #ff0000;}


und krücke is das ned wirklich, anders gehts ned und: das ist CSS-webstandard (hoffentlich, oder??)! :D :)

ja, aber man kann a:visited nicht explizit der klasse linkfarbe2 zuordnen. daher haben linktexte von linkfarbe2 und linkfarbe2, die selbe farbe wenn sie besucht wurden. als schöne lösung würde ich mir erwarten das folgendes möglich wär:


<style>
<!--
.linkfarbe1 {color: #ff00ff; a:link {color: #990000;}; a:visited {color: #660000;} }
.linkfarbe2 {color: #00ff00; a:link {color: #009900;}; a:visited {color: #006600;} }
-->
</style>

...
<div class="linkfarbe1">
textein link
</div>
<div class="linkfarbe2">
anderer text ein link mit anderer farbe
</div>


...so gehts aber leider nicht.

warum nicht ?

a.bluelink:visited {
color : #808080;
cursor : crosshair;
font-family : Arial, Helvetica, sans-serif;
font-size : x-small;
text-decoration : none;
text-transform : lowercase;
}

sollte aber gehen, wenn du die a:visited NACH den inkfarbe1, ...... schreibst.

...hab versucht deinen tip folgendermaßen einzuhängen:


<style>
<!--
a.bluelink:link {color : #000080;}
a.bluelink:visited { color : #000050;}
a.redlink:link {color : #800000;}
a.redlink:visited { color : #500000;}
-->
</style>

....

<div class="redlink">
textein link
</div>
<div class="bluelink">
anderer text ein link mit anderer farbe
</div>


...hat leider überhaupt nicht geklappt. styledefinition scheint synthaktisch falsch zu sein.

naja SO kann sicher nie funktionieren....kennst du dich überhaupt mit css aus? (nur so eine frage..damit ich weiß wo ich ansetzen muß)

du meinst in etwa so?:


<style>
<!--
.linkfarbe1 {color: #ff00ff;}
a:link {color: #990000;}
a:visited {color: #660000;}
.linkfarbe2 {color: #00ff00;}
a:link {color: #009900;}
a:visited {color: #006600;}
-->
</style>

<div class="linkfarbe1">
textein link
</div>
<div class="linkfarbe2">
anderer text ein link mit anderer farbe
</div>



...das klappt ebensowenig wie ...



<style>
<!--
a:link {color: #FF9900;}
a:visited {color: #FF6600;}
-->
</style>
ein text eine linkfarbe
<style>
<!--
a:link {color: #0099FF;}
a:visited {color: #0066FF;}
-->
</style>
mehr text andere linkfarbe


in beiden fällen werden die linkfarben von der letzteren definition überschrieben und angezeigt wird dann nur diese.
...leider

probiers mal mit
ein link mit anderer farbe
ohne dem span...(der braucht einen eigenen csstag)

na, ich gebe zu meine kenntnisse sind bescheiden, aber ich habe zu meinem problem nirgends beispiele gefunden (selfhtml). und mit dem coffeecup stylesheeteditor konnte ich auch nix rausfinden. deshalb dachte ich, daß ich auf diesem wege zu einem schnelleren antwort komme.

nocheinmal meine frage: wie ist es möglich verschiedene linkfarbendefinitionen auf eine seite zu packen?
moorhahn hat schon eine lösung gebracht bei der man jeden link quasi "händisch" einfärben muß. das klappt zwar, hat aber den nachteil, daß besuchte wie unbesuchte links gleich ausschaun.
deine lösung habe ich offensichtlich nicht richtig angewendet - kannst du mir bitte einen größeren codeschnipsel schicken. natürlich nur, wenn ich dir nicht auf den senkel geh, weil sonst lass es bleiben. so wichtig ist das auch wieder nicht.

ich werde mal schauen ob ich auf die schnelle was finde,
zum problem, eine einfache lösung wäre eine java sache, welche sich zyklisch (nach absprache mit einem cookie bei ansteigendem visit jeweils eine andere css file reinlädt..)

aja und empfehlen kann ich bei solchen css geschichten topstyle 2.5 von bradsoft

na, so kanns auch ned gehen, zwei a:visited geht nicht. weiß auch ned wirklich wie es sonst gehen sollte.