Michael der Zweite: class verschachteln?

Hallo

Gibt es eigentlich eine Möglichkeit, CSS-Klassen zu verschachteln bzw. zu vererben?

Ich habe es folgendermassen versucht, es funktioniert aber nicht:

.klasse{
  font-family: Verdana, Helvetica, sans-serif;
  font-size: 12px;
}

.klasse.abgeleitet{
  font-size: 5px;
}

Ich denke, ihr versteht, was ich meine. Ein HTML-Element mit class="klasse" soll die Schrift Verdana mit Grösse 12px haben und ein HTML-Element mit class="klasse.abgeleitet" soll die Schrift Verdana mit grösse 5px haben. Wie gesagt - es geht so eben nicht. Wie könnte man es doch noch bewerkstelligen?

Gruss

Michael

  1. Hi Michael,

    Gibt es eigentlich eine Möglichkeit, CSS-Klassen zu verschachteln bzw. zu vererben?

    </archiv/2004/12/t95623/#m580302>

    Grüße,
     Roland

    1. Danke, das hat geholfen ;-)

  2. Hallo Michael

    Gibt es eigentlich eine Möglichkeit, CSS-Klassen zu verschachteln bzw. zu vererben?

    Außer der von Orlando genannten Möglichkeit mit mehreren Klassen für ein
    Element, kannst du Eigenschaften auch für mehrere Klassen definieren.

    .klasse1, .klasse2{
      font-family: Verdana, Helvetica, sans-serif;
      font-size: 12px;
    }

    .klasse2{
      font-size: 5px;
    }

    Auf Wiederlesen
    Detlef

    --
    - Wissen ist gut
    - Können ist besser
    - aber das Beste und Interessanteste ist der Weg dahin!
  3. Hi Michael!

    Du kannst Klassen "verschachteln", indem du z.B. <div>s verschachtelst, um dann die Elemente innerhalb der verschachtelten <div>s anzusprechen:

    Also im Stylesheet steht dann

    .klasse{
      font-family: Verdana, Helvetica, sans-serif;
      font-size: 12px;
    }

    .abgeleitet{
      font-size: 5px;
    }

    und im HTML-Quelltext steht z.B.

    <div class="klasse">
    <tag>blabla</tag>
    <div class=".abgeleitet">
    <bla>undsoweiter</bla>
    </div>
    </div>

    Wenn Du per CSS gezielt auf <bla> zugreifen willst, die sozusagen class=".klasse.abgeleitet" haben, dann kannst Du im Stylesheet folgendes notieren:
    .klasse .abgeleitet bla { extra-angaben }

    Für _alle_  Elemente (also nicht nur für <bla>s) wäre das
    .klasse .abgeleitet { extra-angaben }

    Hoffentlich hilft Dir das weiter... :-)

    Liebe Grüße aus Ellwangen,

    Felix Riesterer.