css verschachteln

[martinR]

Tach,

ich habe zwei css-deffinitionen, die fast gleiche Ergebnisse liefern. Kann man irgendwie die Eigenschaften "auslagern", die in beiden gleich sind?

Beispiel:

.test-klein {
font-family:Arial,Helvetica,Geneva,Sans Serif;
font-weight:bold;
font-size:8px;
background-color:#CCCCCC;
color:#FFFFFF;
}

.test-gross {
font-family:Arial,Helvetica,Geneva,Sans Serif;
font-weight:bold;
font-size:24px;
background-color:#CCCCCC;
color:#FFFFFF;
}

Wie man sieht unterscheiden die sich ja nur bei der Schriftgröße. Warum also alles andere doppelt schreiben? Gibt's eine Lösung?

Danke

Martin

[theo]

versuchs doch mal so rum:

font {
font-family:Arial,Helvetica,Geneva,Sans Serif;
font-weight:bold;
background-color:#CCCCCC;
color:#FFFFFF;
}

.test-klein {
font-size:8px;
}

.test-gross {
font-size:24px;
}


und dann im script

<font class=' ... '>blablabla</font>

[toerag]

wieso machste nicht einfach eine definition von h1?

.test-klein {
font-family:Arial,Helvetica,Geneva,Sans Serif;
font-weight:bold;
font-size:8px;
background-color:#CCCCCC;
color:#FFFFFF;
}

.test-gross {
font-family:Arial,Helvetica,Geneva,Sans Serif;
font-weight:bold;
font-size:24px;
background-color:#CCCCCC;
color:#FFFFFF;
}{

daus machste einfach dann :
.text{
font-family:Arial,Helvetica,Geneva,Sans Serif;
font-weight:bold;
font-size:8px;
background-color:#CCCCCC;
color:#FFFFFF;
h1:font-size:24px
}
müsste glaube ich klappen...
bin auch erst neu in CSS..

[Colin Schlüter]

Hallo!

Folgendermaßen geht es direkt in CSS:

Erst bekommen beide Klassen die gleichen Eigenschaften:

.test-klein, .test-gross {
font-family:Arial,Helvetica,Geneva,Sans Serif;
font-weight:bold;
background-color:#CCCCCC;
color:#FFFFFF;
}

Und dann zusätzlich noch ihre spezielle Schriftgröße:

.test-gross {
font-size:24px;
}

.test-klein {
font-size: 8px;
}

Colin

[martinR]

Danke Colin,

ausprobiert und für gut befunden!

cu

Martin