Variablen in CSS ?

Hallo zusammen,

hoffentlich ist die Frage nicht zu blöd, aber:
Gibt es bei CSS Variablen?
Ich hab gerade das Problem (bzw die „Unschönheit“), daß ich in einer mittlerweile ziemlich grossen CSS Datei Farbwerte und Schriftgrössen mehrfach stehen habe. Zum grossen Teil sind diese mehrfachen Abgaben nicht durch Vererbung auflösbar.
Daher wären Variablen sinnvoll, die ich einmal definiere und dann im CSS mehrfach als Wert angebe.
Ist sowas möglich?

Viele Grüße
Matthias

Hallo,

Gibt es bei CSS Variablen?

Nein. „You can solve any problem in Computer Sience by introducing another abstraction layer“ – Quelle vergessen :wink:

Ich hab gerade das Problem (bzw die „Unschönheit“), daß ich in
einer mittlerweile ziemlich grossen CSS Datei Farbwerte und
Schriftgrössen mehrfach stehen habe. Zum grossen Teil sind
diese mehrfachen Abgaben nicht durch Vererbung auflösbar.
Daher wären Variablen sinnvoll, die ich einmal definiere und
dann im CSS mehrfach als Wert angebe.

Nein. Aber du kannst z.B. alle Deklarationen eines Farbwerts einer Stelle machen:

.topOfPage, q, h1, h2, h3, .headerTitle, .headerLinks, .headerLinks \*, .sideBox div, #footer \*
{ color: #70709f; }

Und den Rest der Deklarationen wo anders.

Oder du jagst deine CSS-Dateien vor dem veröffentlichen durch eine Präprozessor, z.B. GPP.

Grüße,
Moritz

Hi Matthias,

Gibt es bei CSS Variablen?

Wenn Du in CSS programmieren möchtest, brauchst Du dazu eine Programmiersprache. CSS ist aber keine Programmiersprache und funktioniert nur kaskadierend durch Überschreibung. Wenn Du z.B. per PHP das CSS generierst, ist die Sache schon anders. Dann kannst Du innerhalb des Stylesheets nebst Variablen praktisch alles anwenden, Switches, Schleifen, etc.

In der htaccess kannst Du Apache instruieren, css wie PHP zu parsen:

AddType application/x-httpd-php .css

oder Du bindest eine PHP-Datei per wie ein Stylesheet ein.

Innerhalb des CSS, das nun wie PHP behandelt wird bzw. der PHP-Datei, musst Du dann am Anfang den Content-Type ausgeben

<?php header('Content-type: text/css'); ?>

Danach deklarierst Du Deine Variablen bevor Du sie brauchst in einem PHP-Block, z.B.

<?php $backgroundcolor = '#FFCC00'; ?>

Die kannst Du dann im CSS überall einfügen, z.B.

#foo {
 background: =$backgroundcolor?\>;
}

Du kannst beim Einbinden des CSS auch Queries übergeben, z.B.

und innerhalb des CSS dann auslesen und damit das dynamische CSS generieren:

<?php $browser = $_GET['browser']; ?> 
#bar {
 margin:=($browser=='firefox)?'10px':'5px'?\>;
}

Ciao,
Rudy