Hallo,
ich möchte gerne in meinem Style-Sheet Bereiche über- und unterordnen, finde dazu aber nichts und weiß auch nicht, ob das so geht, hätte aber eine Vermutung, dass *wenn* es geht, dann so:
weil es gibt ja so Konstrukte wie
Hintergrund ist sich folgendes...
Ich habe ganz viele Klassen, die ich wiederum mit anderen (mehreren) Klassen zusammen führen möchte...
Beispiel
(nochmal zur Verdeutlichung, die UNTERKLASSEN PRO REIHE GEHÖREN ZUSAMMEN, das machts ja so Tricky!, keine KOMMA-Separierung)
Alle Oberklassen 1, 2 und 3 haben diese Unterklassen 1-9 und die Unterklassen müssen immer das gleiche machen die bei allen anderen.
Nun könnte man die Oberklassen natürlich weg lassen um es zu globalisieren,
was würde sich aber dann negativ auf andere Oberklassen auswirken, die wiederum auch diese Unterklassen haben aber nicht davon beeinflusst werden sollen...
Jetzt werden sicher wieder einige sagen, benenn die Klassen um, aber es geht einfach nicht.
Es geht hier teilweise direkt um H1-H4 Elemente (im Bereich der Unterklassen) und die Oberklassen sind auch festgelegt.
Hat jemand eine Idee, wie man sowas hier besser gruppiert / in CSS übersichtlicher gestaltet?
Das hier ist das Beispiel für ein Konstrukt, wie es in realistischer Form existiert, was ich aber kleiner machen möchte.
So würde es zwar Technisch funktionieren,ist aber doch echt viel mit Redundanz:
In wirklichkeit siehts noch viel Schlimmer aus, weil bei den Unterklassen auch noch Opperatoren wie :hover und :nth-child(odd) etc. hinzu kommen,
das wird einfach total unübersichtlich wenn man das für alle Oberklassen wiederholen muss...
Schöne Grüße
ich möchte gerne in meinem Style-Sheet Bereiche über- und unterordnen, finde dazu aber nichts und weiß auch nicht, ob das so geht, hätte aber eine Vermutung, dass *wenn* es geht, dann so:
PHP-Code:
.OBERKLASSE {
.UNTERKLASSE {width:100px}
}
PHP-Code:
@MEDIA TRALLALA {
.KLASSE {width:100px;}
}
Hintergrund ist sich folgendes...
Ich habe ganz viele Klassen, die ich wiederum mit anderen (mehreren) Klassen zusammen führen möchte...
Beispiel
PHP-Code:
.OBERKLASSE1, .OBERKLASSE2, .OBERKLASSE3 {
.unterklasse.unterklasse2.unterklasse3 {width:100px}
.unterklasse4.unterklasse5.unterklasse6 {float:left}
.unterklasse7.unterklasse8.unterklasse9 {background-color:#ff0000}
}
Alle Oberklassen 1, 2 und 3 haben diese Unterklassen 1-9 und die Unterklassen müssen immer das gleiche machen die bei allen anderen.
Nun könnte man die Oberklassen natürlich weg lassen um es zu globalisieren,
was würde sich aber dann negativ auf andere Oberklassen auswirken, die wiederum auch diese Unterklassen haben aber nicht davon beeinflusst werden sollen...
Jetzt werden sicher wieder einige sagen, benenn die Klassen um, aber es geht einfach nicht.
Es geht hier teilweise direkt um H1-H4 Elemente (im Bereich der Unterklassen) und die Oberklassen sind auch festgelegt.
Hat jemand eine Idee, wie man sowas hier besser gruppiert / in CSS übersichtlicher gestaltet?
Das hier ist das Beispiel für ein Konstrukt, wie es in realistischer Form existiert, was ich aber kleiner machen möchte.
So würde es zwar Technisch funktionieren,ist aber doch echt viel mit Redundanz:
PHP-Code:
.OBERKLASSE1 .unterklasse.unterklasse2.unterklasse3,
.OBERKLASSE2 .unterklasse.unterklasse2.unterklasse3,
.OBERKLASSE3 .unterklasse.unterklasse2.unterklasse3 {width:100px}
.OBERKLASSE1 .unterklasse4.unterklasse5.unterklasse6,
.OBERKLASSE2 .unterklasse4.unterklasse5.unterklasse6,
.OBERKLASSE3 .unterklasse4.unterklasse5.unterklasse6 {float:left}
.OBERKLASSE1 .unterklasse7.unterklasse8.unterklasse9,
.OBERKLASSE2 .unterklasse7.unterklasse8.unterklasse9,
.OBERKLASSE3 .unterklasse7.unterklasse8.unterklasse9 {background-color:#ff0000}
In wirklichkeit siehts noch viel Schlimmer aus, weil bei den Unterklassen auch noch Opperatoren wie :hover und :nth-child(odd) etc. hinzu kommen,
das wird einfach total unübersichtlich wenn man das für alle Oberklassen wiederholen muss...
Schöne Grüße
.
Kommentar