Farbe in Variable speichern

  • Liebe CSS-Profis,


    dieser code


    CSS
    :root {
    	--rot:#D90808;
    }
    
    
    
    
    h1 {
    	color:var(--rot);
    }


    funtioniert wunderbar im aktuellen Firefox, aber leider nicht im IE (IE11, Edge, mobile). Hintergrund: Ich möchte die eigentlichen Farbwerte gerne zentral speichern, damit ich diese nur 1x angeben muss. Die css ist in einer externen Datei im gleichen Verzeichnis wie die html und wird dort im Header mit <link...> eingebunden. Gebe ich die Farben direkt an, d.h. ohne Variable, funktionert es auch mit MS.



    Könnte mir jemand bitte verraten, warum dies in den MS-Varianten nicht funktioniert und insbesondere, wie ich das zum Laufen bekommen kann?


    Vielen herzlichen Dank!


    NP.


    PS "nicht funktioniert" heißt hier: "CSS wird komplett ignoriert"

  • Der Grund ist die Browser-Unterstützung. (siehe caniuse.com) Leider gibt es dementsprechend keine Möglichkeit, es in diesen Browsern zum Laufen zu bekommen.


    Stattdessen kannst du nur einen CSS-Präprozessor wie z.B. Sass nutzen, um Variablen verwenden zu können.

  • Naja, an der Unterstützung von CSS-Variablen kann man die Qualität eines Browsers jetzt nicht wirklich fest machen.


    War gerade nämlich sogar ziemlich überrascht, dass die meisten anderen Browser das schon so gut unterstützen. :D


    Da tut man sich bei manchen anderen Features deutlich schwerer...

  • Ja. Hast ja recht. Ich war nur so glücklich, dass so etwas endlich geht, naja, bis ich eben IE öffnete. Sass war ein sehr guter Tipp. Ich lade mir gerade Koala runter und schau mir das mal an. Scheint ja auch kein Hexenwerk zu sein.


    Danke


    NP

  • Ja, leider ist der IE schon nicht gerade der modernste Browser und hängt in den meisten Fällen ein wenig hinterher. Insofern kann ich deine Enttäuschung durchaus nachvollziehen.


    Sass ist auf jeden Fall einen Blick wert, insbesondere, da es nicht nur Variablen, sondern noch viel mehr bietet.


    Alternativ gibt es natürlich noch Less und Stylus, um mal die bekanntesten Präprozessoren genannt zu haben, aber letzendlich ist Sass doch noch am verbreitetsten, auch wenn es hauptsächlich eine Glaubensfrage ist, welchen man besser findet.

  • So. Noch eine allerletzte Rückmeldung: SASS im Zusammenspiel mit Koala funktioniert einfach und spitze. Sass (scss) hat einen weitaus deckungsgleichen Syntax wie CSS - ich musste nur die Variablen anders definieren. Koala (Open Source) beobachtet die Datei(en) und erstellt sofort eine entsprechende css, wenn ich an den scss-Dateien etwas geändert habe. WinSCP hält dann das Arbeitsverzeichnis mit dem Onsiteverzeichniss aktuell und alles läuft wie geschmiert.


    Vielen Dank für diesen Tipp - auch wenn ich (noch) nicht mehr der SASS-Features benötige..die zuverlässige Nutzung der Variablen reicht schon aus, um vom Roh-CSS abzuweichen. :D

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!