css Verweis auf bereits definierte Eigenschaften?

[Linuchs]

Moin,

in einem Kalenderprojekt habe ich in der zentralen farben.css die Hintergrund-Farben der Monate festgelegt.

.bgjan      {background-color:#d9f8ff!important}
.bgjantitel {background-color:#00ccff!important}

In den verschiedenen Kalendern möchte ich im style Bereich gerne darauf zurückgreifen:

div.a4_quer div#m01    { left:169mm; + .bgjan }
div.a4_quer div#m02    { left:248mm; + .bgfeb }

Geht das? Wenn ja, wie?

Linuchs

[Matthias Apsel]

Hallo Linuchs,

div.a4_quer div#m01    { left:169mm; + .bgjan }
div.a4_quer div#m02    { left:248mm; + .bgfeb }

Geht das? Wenn ja, wie?

Mit CSS allein nicht, mit Präprozessoren wie SASS oder anderen serverseitigen Techniken schon.

Bis demnächst
Matthias

[Gunnar Bittersmann]

@@Matthias Apsel

div.a4_quer div#m01    { left:169mm; + .bgjan }
div.a4_quer div#m02    { left:248mm; + .bgfeb }

Geht das? Wenn ja, wie?

Mit CSS allein nicht

Nicht?

:root
{
  --default-background-color: #d9f8ff;
  --title-background-color: #00ccff;
}

.bgjan      { background-color: var(--default-background-color) }
.bgjantitel { background-color: var(--title-background-color) }

div.a4_quer div#m01    { left:169mm; background-color: var(--default-background-color) }
div.a4_quer div#m02    { left:248mm; background-color: var(--title-background-color) }

In Firefox; demnächst auch in Ihrem Browser.

LLAP 🖖

[Matthias Apsel]

Hallo Gunnar Bittersmann,

Mit CSS allein nicht

Nicht?

Nicht.

:root
{
  --default-background-color: #d9f8ff;
  --title-background-color: #00ccff;
}

.bgjan      { background-color: var(--default-background-color) }
.bgjantitel { background-color: var(--title-background-color) }

div.a4_quer div#m01    { left:169mm; background-color: var(--default-background-color) }
div.a4_quer div#m02    { left:248mm; background-color: var(--title-background-color) }

Ich glaube nicht, dass das für den konkreten Anwendungsfall praktikabel sein könnte.

In Firefox; demnächst auch in Ihrem Browser.

Eben. Und die Nebenwirkungen sind nicht überschaubar.

Bis demnächst
Matthias

[Gunnar Bittersmann]

@@Matthias Apsel

Ich glaube nicht, dass das für den konkreten Anwendungsfall praktikabel sein könnte.

Warum nicht? Es geht doch genau darum, Farben an genau einer Stelle festzulegen und diese Festlegungen in Deklarationen wiederzuverwenden.

In Firefox; demnächst auch in Ihrem Browser.

Eben. Und die Nebenwirkungen sind nicht überschaubar.

Es gibt Polyfills. Und CSS-Postprozessoren.

Aber meine Antwort war aber eher ein „Doch!“ auf dein „Mit CSS allein nicht“ denn eine Empfehlung, CSS-Variablen heute schon produktiv einzusetzen.

In wenigen Wochen könnte die Empfehlung schon anders aussehen.

LLAP 🖖

[Der Martin]

Hallo,

in einem Kalenderprojekt habe ich in der zentralen farben.css die Hintergrund-Farben der Monate festgelegt.

.bgjan      {background-color:#d9f8ff!important}
.bgjantitel {background-color:#00ccff!important}

In den verschiedenen Kalendern möchte ich im style Bereich gerne darauf zurückgreifen:

div.a4_quer div#m01    { left:169mm; + .bgjan }
div.a4_quer div#m02    { left:248mm; + .bgfeb }

Geht das? Wenn ja, wie?

so jedenfalls nicht. Aber du kannst den entsprechenden Elementen im Markup zwei oder mehr Klassen geben, so dass sie die CSS-Eigenschaften mehrerer Klassen bekommen.

So long,
 Martin

[Gunnar Bittersmann]

@@Linuchs

.bgjan      {background-color:#d9f8ff!important}
.bgjantitel {background-color:#00ccff!important}

Wenn da !important steht, hast du vermutlich was falsch gemacht.

LLAP 🖖