CSS

CSS (Cascading Style Sheets) ist die Stylesheet-Sprache, mit der das visuelle Erscheinungsbild von HTML-Inhalten festgelegt wird - etwa Farben, Abstände, Schriftarten und Layout.

Kurz erklärt

CSS trennt Inhalt und Struktur (definiert in HTML) vom visuellen Erscheinungsbild einer Seite. Über sogenannte Selektoren wird festgelegt, welche HTML-Elemente bestimmte Stilregeln erhalten sollen - etwa alle Absätze, ein bestimmtes Element per ID, oder alle Elemente einer bestimmten Klasse. Der Name “Cascading” (kaskadierend) bezieht sich darauf, dass mehrere, teils widersprüchliche Regeln nach festen Prioritätsregeln zu einem einzigen, konsistenten Ergebnis zusammengeführt werden.

Beispiel

Die Regel p { color: blue; font-size: 16px; } weist den Browser an, alle <p>-Absätze in Blau und mit 16 Pixel Schriftgröße darzustellen - unabhängig davon, wie viele Absätze die HTML-Struktur enthält.

Warum ist das relevant?

Ohne CSS würden alle Websites im unformatierten Standard-Erscheinungsbild des Browsers dargestellt. CSS ermöglicht nicht nur individuelles Design, sondern auch responsive Layouts, die sich an unterschiedliche Bildschirmgrößen anpassen, sowie Animationen und Übergänge. Wie effizient CSS geschrieben und geladen wird, wirkt sich zudem direkt auf Performance-Kennzahlen wie die Core Web Vitals aus.

Häufige Missverständnisse

CSS ist keine Programmiersprache und enthielt lange keine Logik im klassischen Sinn - Fallunterscheidungen oder Berechnungen mussten früher über JavaScript ergänzt werden, auch wenn moderne CSS-Funktionen wie calc() oder Container-Queries diese Grenze zunehmend verwischen. Auch überschreibt nicht automatisch die zuletzt geschriebene CSS-Regel alle vorherigen - welche Regel tatsächlich greift, hängt von einem festen Zusammenspiel aus Spezifität, Reihenfolge und Herkunft der Regel ab.

Weiterführende Inhalte