vereinfachter CSS-Import von verschiedenen Medien 2


In meinem letzten Artikel habe ich über die Probleme beim Import von externen CSS-Dateien berichtet. Nun habe ich eine vereinfachten Import gefunden, denn das Einbinden von bis zu 6 Dateien bläht nicht nur der Quellcode auf, sondern sieht auch irgendwie unübersichtlich aus.

Ich weiß, diese Idee ist nicht unbedingt die neuste, aber sie gefällt mir und deshalb schreibe ich darüber

Also, im Grunde reicht es, wie gehabt, über den <link>-Tag die externen CSS-Dateien einzubinden. Diese mal werden aber nicht alle direkt per Link eingebunden, sondern nur eine zentrale Verwaltungsdatei pro Ausgabemedium, die dann die Restlichen nachlädt.













Die zentrale Medien-Datei bekommt dann folgenden Code:





Es gibt also für jedes Ausgabe-Design einen eigenen Style-Ordner in dem dann jeweils eine CSS-Datei für den global Reset, das grundlegende Layout und die weiteren Design-Angaben, wie z.B. Farb- und Typographie-Angaben, definiert werden.

@Media-Regel

Ein weitere Ansatz wäre die Nutzung der @import-Regel von CSS. Diesen habe ich aber leider noch nicht in allen, heutzutage genutzten Browsern getestet. Hierbei reicht es wieder in der HTML-Datei nur eine externe CSS-Datei einzubinden und in der CSS-Datei werden die nachzuladenen Datei durch die @media-Regel von einander getrennt.





























Wer in diesem Zusammenhang Erfahrung oder vielleicht Verweise zu weiterführenden Informationen hat, kann ja hier einen Kommentar abgeben.

Auf jeden Fall werde ich natürlich an der Sache dran bleiben und über neue Erkenntnisse berichten.


Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

2 Gedanken zu “vereinfachter CSS-Import von verschiedenen Medien

  • Christian

    Hallo Enrico,

    bei meinen Versuchen mit dieser Art des Einbindens von externen CSS-Dateien ist mir leider noch zusätzlich aufgefallen, dass an der Stelle, wo man selbst den IE überlisten kann, der ansonsten so grandiose WIN Safari streikt. Es scheint, als gäbe es da keine Möglichkeit, mit @import zu arbeiten.

    Gruß Christian