Aus dem Kurs: Webtechniken lernen 3: Responsive CSS-Layouts mit Media Queries, Flexbox und Grid

So erhalten Sie Zugriff auf diesen Kurs

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 23.200 Kurse von Branchenfachleuten.

Solution: Farbwerte für die Übungswebsite mit CSS-Variablen definieren

Solution: Farbwerte für die Übungswebsite mit CSS-Variablen definieren

Aus dem Kurs: Webtechniken lernen 3: Responsive CSS-Layouts mit Media Queries, Flexbox und Grid

Gratismonat starten Für Ihr Team erwerben

Solution: Farbwerte für die Übungswebsite mit CSS-Variablen definieren

“

(Musik) Die Challenge bestand darin, Custom Properties zu definieren, diese als Variable zuzuweisen und dann im Browser zu testen, ob alles funktioniert hat. Los geht es mit dem ersten Teil, dem Definieren der Custom Properties, hier als globale Custom Properties bezeichnet, weil sie für das Stammelement html definiert werden. Man sieht hier manchmal statt des Stammelementes des html auch eine Pseudoklasse wie :root, das ist letztendlich dasselbe, nur dass :root eine etwas höhere Spezifität hat, nämlich 10 gegenüber 1 für das Stammelement. In der Praxis hat das aber keine unterschiedlichen Auswirkungen. Zu den Namen der Custom Properties, das ist wirklich zum großen Teil Geschmackssache, es muss für Sie funktionieren. Ich habe das relativ abstrakt gemacht, also color-base, Basisfarbe dunkel, Basisfarbe hell für schwarz und weiß, dann eine primäre Farbe und eine etwas hellere Version der primären Farbe, eine Akzentfarbe, color-accent, und eine aktive Akzentfarbe, das ist häufig bei den…

Inhalt