DRY meine CSS aus, wollen aber die grundlegende CSS-Syntax halten

Question

Starten eine neue Schienen projizieren und wir haben eine gut durchdacht Farbpalette und wollen zu erfassen, die an einem Ort. Ich habe in der Regel Farben in der CSS gehalten, aber ich finde ich alle die gleiche Farbe in vielen verschiedenen Selektoren am Ende, wie es als Hintergrundfarbe zeigt, Farbe, Grenze Farbe usw. auch ich werde occassionally brauchen Zugang zu Farben in der Javascript. Es wäre toll, nur jede Farbe definiert ONCE.

Also ich möchte nur meine Farbpalette in einer Art und Weise zu definieren, dass die wiederverwendbar in der CSS und Javascript, aber ich will nicht den ganzen Weg nach SASS gehen, vollständig CSS-Syntax zu verlassen.

Sie haben ein Schienen-Plugin bereits gemacht, dass dies erlaubt? Ich konnte eine ERB Typ Lösung Patch zusammen, aber ich will nicht, es zu tun, wenn jemand anderes etwas leicht verfügbar ist.

Answer 1

Es gibt ein neues Projekt heraus aufgerufen {} weniger das klingt wie das, was Sie suchen: http://lesscss.org /

Answer 2

WENIGER eine Schienen-Plugin und eine CSS-ähnliche Syntax.

Answer 3

Es gibt mehrere Serverseite Parsern wie LESS und SASS, aber wenn man die palett Mentalität in gerade CSS verwenden wollen, müssen Sie Ihr Denken revers. Definieren grundlegende Stile wie Farben, Schriftarten usw. und gelten mehrere Klassen auf Tag-Ebene.

[Stil]

.color1 {color: red}

.color2 {color: blue}

.color3 {color: green}

.bcolor1 {color: red}

.bcolor2 {color: blue}

.bcolor3 {color: green}

[/ style]

[tag class = "color1 bcolor2"]

Das ist für uns sehr gut funktioniert hat.

Answer 4

Weitere (reine CSS) Art und Weise kann jede Farbe einmal zu definieren, und haben die verschiedenen Selektoren mit diesem oe Farbdefinition zugeordnet, zum Beispiel:

body,
p,
#foo,
.bar {color: #802369 }