Peter: CSS --- Kann mir jemand bei Klassenunterteilungen helfen?

Folgendes Problem:

Hier ein kleiner Beispielcode um zu erklären, wie mein Problem ausschaut:
<html>
<head>
</head>
<body>
<a href=klo.html>klo</a>
blablabla
<a href=raus.html>raus</a>
</body>
</html>

folgendes: Ich will, nein muss, den ersten Link schwarz, bei nichtbenutzung, rot bei mouseover und schwarz bei visited haben. Der zweite Link soll blau bei nichtbenutzung, rot bei mouseover und blau bei visited sein.

Also eigentlich:

a:link { color:#000000;}
a:visited { color:#000000;}
a:hover { color:#FF0000;}

und

a:link { color:#0000FF;}
a:visited { color:#0000FF;}
a:hover { color:#FF0000;}

Ich hab versucht das mit Klassen reinzukriegen, hat aber nicht funktioniert.

Hier mal eine von meinen gescheiterten Versuchen: div.schwarz { a:link { color:#000000;}; a:visited { color:#000000;}; a:hover { color:#FF0000;} }

BITTE HELFT MIR!!! Danke im Vorraus :)

  1. Hi Peter

    das geht ungefähr so

    CSS->

    a.definition1:link { color:#000000;}
    a.definition1:visited { color:#000000;}
    a.definition1:hover { color:#FF0000;}

    a.definition2:link { color:#0000FF;}
    a.definition2:visited { color:#0000FF;}
    a.definition2:hover { color:#FF0000;}

    HTML->

    <a href="wasauchimmer" class="definition1">LINK</a>

    <a href="wasauchimmer" class="definition2">Noch einer</a>

    bye lulu

    1. Danke euch beiden, aber ich möchte die class nicht in den <a> Tag setzen, denn ich habe eine ganze Menge Links auf einer Menge Seiten.
      Wenn es nicht anders (also z.b. mit <div> oder <span> geht, bleibt mir aber wohl nix anderes übrig.)

      1. Danke euch beiden, aber ich möchte die class nicht in den <a> Tag setzen, denn ich habe eine ganze Menge Links auf einer Menge Seiten.
        Wenn es nicht anders (also z.b. mit <div> oder <span> geht, bleibt mir aber wohl nix anderes übrig.)

        Wenn du zwei Bereiche mit DIV abgrenzen kannst, in denen die Links jeweils einheitlich aussehen sollen, nimm verschachtelte CSS-Definitionen!

        div.schwarz a:link { ...definitionen }
        div.weiss a:link {...definitionen }

        Das wirkt auf alle Links der Seite
        <div class="schwarz"><a href="eins.htm">Link schwarz</a></div>
        <div class="weiss"><a href="eins.htm">Link schwarz</a></div>

        Die CSS-Definition sagt, daß alle A-Tags, die im DIV-Tag der jeweiligen Klasse stehen, entsprechend formatiert werden sollen.

        Achtung: Wenn du noch andere Tags um die A-Tags herum schachtelst, müssen die auch mit in die Aufzählung rein. Also bei einem
        <DIV><P><A></A></P></DIV> müßte das CSS mit
        div.klasse p a:link
        definiert werden.

        - Sven Rautenberg

  2. <html>
    <head>
    </head>
    <body>
    <a href=klo.html>klo</a>
    blablabla
    <a href=raus.html>raus</a>
    </body>
    </html>

    Hier mal eine von meinen gescheiterten Versuchen: div.schwarz { a:link { color:#000000;}; a:visited { color:#000000;}; a:hover { color:#FF0000;} }

    mal abgesehen davon, dass der untere Teil so nicht funktionieren
    kann, wo ist im oberen Bereich div.schwarz enthalten?
    Poste mal bitte den kompletten relevanten Quellcode oder den URL
    zu einer Beispielseite.
    Man kann sehr wohl die Links innerhalb es bestimmten DIV-Bereiches
    explizit ansprechen, ohne extra für diese Links eine Klasse festzu-
    legen, aber dafür muß es diesen DIV-Bereich natürlich auch erstmal
    geben ;-)

    1. <html>
      <head>
      </head>
      <body>
      <a href=klo.html>klo</a>
      blablabla
      <a href=raus.html>raus</a>
      </body>
      </html>

      Hier mal eine von meinen gescheiterten Versuchen: div.schwarz { a:link { color:#000000;}; a:visited { color:#000000;}; a:hover { color:#FF0000;} }

      mal abgesehen davon, dass der untere Teil so nicht funktionieren
      kann, wo ist im oberen Bereich div.schwarz enthalten?
      Poste mal bitte den kompletten relevanten Quellcode oder den URL
      zu einer Beispielseite.
      Man kann sehr wohl die Links innerhalb es bestimmten DIV-Bereiches
      explizit ansprechen, ohne extra für diese Links eine Klasse festzu-
      legen, aber dafür muß es diesen DIV-Bereich natürlich auch erstmal
      geben ;-)

      Ich hab ein <div> </div> bereits drin, das class hab ich immer eingesetzt wenn ich dachte diesmal würde es klappen... aber das hat es nie. Ich möchte ja nur wissen wie der Style Sheet für eine Div-Klasse aussehen muss.

      1. erstmal: </selfaktuell/forum/faq/forumsfaq_2.htm#naq4>

        Ich hab ein <div> </div> bereits drin, das class hab ich immer eingesetzt wenn ich dachte diesmal würde es klappen... aber das hat es nie. Ich möchte ja nur wissen wie der Style Sheet für eine Div-Klasse aussehen muss.

        Ahso, na dann verwende doch einfach

        DIV.schwarz { color:#FF0000; }

        oder wo war jetzt das Problem?

  3. Folgendes Problem:

    Hier ein kleiner Beispielcode um zu erklären, wie mein Problem ausschaut:
    <html>
    <head>
    </head>
    <body>
    <a href=klo.html>klo</a>
    blablabla
    <a href=raus.html>raus</a>
    </body>
    </html>

    folgendes: Ich will, nein muss, den ersten Link schwarz, bei nichtbenutzung, rot bei mouseover und schwarz bei visited haben. Der zweite Link soll blau bei nichtbenutzung, rot bei mouseover und blau bei visited sein.

    Also eigentlich:

    a:link { color:#000000;}
    a:visited { color:#000000;}
    a:hover { color:#FF0000;}

    und

    a:link { color:#0000FF;}
    a:visited { color:#0000FF;}
    a:hover { color:#FF0000;}

    Ich hab versucht das mit Klassen reinzukriegen, hat aber nicht funktioniert.

    Hier mal eine von meinen gescheiterten Versuchen: div.schwarz { a:link { color:#000000;}; a:visited { color:#000000;}; a:hover { color:#FF0000;}; }

    BITTE HELFT MIR!!! Danke im Vorraus :)

    Hatte im letzten Code ein ";" vergessen, jetzt ist es da, schaut im Quote nach, danke. Daran liegt es aber nicht, war ein schreibfehler eben.

  4. hi!

    klassen bildest du so:

    im head:

    statt: a:link...
    einfach: a.KLASSENNAME:link..., a.KLASSENNAME2:link... usw.

    im body:

    <a class="KLASSENNAME" href="...">
    bzw.
    <a class="KLASSENNAME2" href="...">