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.

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

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

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

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

(Musik) Willkommen zur Challenge für dieses Kapitel, und es geht darum, Farbwerte als CSS-Variablen zu speichern, und zwar für die Übungswebsite. Speichern Sie alle Farbwerte der Übungswebsite Custom Property, überlegen Sie sich ein Schema für die Farbnamen, das Ihnen gefällt. Das kann schwieriger sein, als man glaubt, aber es soll Ihnen gefallen, es soll für Sie aussagekräftig sein, nicht zu abstrakt und auch nicht zu konkret. Speichern Sie die Custom Properties am Anfang von basis.css, am besten mit dem Selektor html, damit sie für alle Elemente zur Verfügung stehen. Weisen Sie sie im weiteren CSS mit der Funktion var() zu, und testen Sie im Browser danach, ob nach diesen Schritten alles funktioniert, also, ob die Farben noch genauso da sind wie vorher. Sie können natürlich dann auch einmal eine Farbe ändern und schauen, ob sich die Änderungen an allen relevanten Stellen auswirken. Viel Spaß mit der Challenge. Wir sehen uns in der Solution.

Inhalt