Variable in css funktioniert nicht. Warum?

Ich arbeite in Visual Studio und habe ein neues Projekt (ASP.NET Core-Web-App (Model View Controller)) gestartet. Ich wollte ein Dark/Light Mode erstellen, jedoch funktionieren die Variablen nicht. Die Variablen werden erkannt, jedoch ist es als hätten sie keinen Wert.

Kann mir jemand helfen?

Answer 1

[Babelfish]

Ohne dein HTML zu kennen, kann man dazu kaum etwas sagen. Die Definition sieht korrekt aus. Allerdings weiß ich nicht, ob du die Klassen für den Header im HTML richig gesetzt hast oder ob du die Hintergrundfarbe vielleicht an anderer Stelle überschreibst.

Es benötigt also mehr Infos und am besten ein echtes Beispiel, damit man sich das mal genau ansehen kann.

Woher ich das weiß: Berufserfahrung – Entwickle Webseiten seit über 25 Jahren.

Answer 2

[Mirko Marek]

Hi Tobias558,

ich sehe leider keinen Fehler in CSS. Vielleicht ist die Klasse nicht richtig eingebunden. Wenn du uns mehr vom Code zeigen könntest, kann man das besser verstehen wo das Problem ist.

Woher ich das weiß: Berufserfahrung – Ich bin gelernter Mediengestalter Digital und Print(IHK)

Answer 3

[Holzbiene2024]

Ich habe mich noch nicht mit CSS Variablen beschäftigt. Mir fällt aber auf, dass du --main-background-color-dark zwar ais Eigenschaft von :root definiert hast.

Ist damit die Variable definiert?

Comments

[Tobias558]

Ja, alle Variablen die in root definiert und deklariert wurden sind die Standard Werte sie und können Überschrieben werden.

[Holzbiene2024]

@Tobias558

Aha, die zwei - machen eine Eigenschaft zur Variablen?

[Holzbiene2024]

@Holzbiene2024

In meinem Firefox 126.0.1 (64-Bit) Ubuntu funktioniert's

 :root {
   --main-background: #ccf;
 }
 body {
   background: var(--main-background);
 }

Wieder was dazugelernt, danke. Der Tag ist gerettet.