Variablen
Teil des Abschnitts Practical Frontend der HTML-Journey von Coddy — Lektion 1 von 35.
Wenn Sie größere und komplexere Websites erstellen, wird die Verwaltung von wiederkehrenden Farben, Größen oder Schriftarten schwieriger. Das Ändern eines einzelnen Wertes bedeutet, dass viele Stellen aktualisiert werden müssen.
CSS-Variablen ermöglichen es Ihnen, diese Werte als Namen zu speichern (wie --main-color) und sie in Ihrem gesamten CSS wiederzuverwenden. Ändern Sie die Variable einmal, und sie wird überall automatisch aktualisiert.
Sie sind sehr hilfreich, um den Code sauber und konsistent zu halten, und viele Entwickler verwenden sie, um moderne Websites zu erstellen.
Teste dich selbstDiese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Teste dich selbstDiese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Spickzettel
CSS-Variablen ermöglichen es Ihnen, Werte als Namen zu speichern und sie in Ihrem gesamten CSS wiederzuverwenden. Sie helfen dabei, den Code sauber und konsistent zu halten.
Definieren Sie Variablen mit dem Präfix -- und verwenden Sie diese mit var():
:root {
--main-color: blue;
}
.element {
color: var(--main-color);
}Ändern Sie die Variable einmal, und sie wird überall automatisch aktualisiert.
Probier es selbst
Diese Lektion enthält keine Programmieraufgabe.
Teste dich selbstDiese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Alle Lektionen in Practical Frontend
1Variablen
VariablenCSS-Variablen verwendenVariablen für Design TokensLokale VariablenWiederholungs-Challenge7Abschlussherausforderungen
ProfilkarteSchokoladengalerie-RasterSieben WeltwunderNeue sieben Weltwunder