CSS (Cascading Style Sheets) ist die Stylesheet-Sprache des Webs, die festlegt, wie HTML-Elemente auf dem Bildschirm, auf Papier oder in anderen Medien visuell dargestellt werden.
Was bedeutet das?
HTML beschreibt die Struktur und den Inhalt einer Webseite. CSS beschreibt deren Erscheinungsbild: Farben, Schriftarten, Abstände, Positionierung, Animationen und Layouts. Die Trennung von Inhalt (HTML) und Gestaltung (CSS) ist ein Grundprinzip des modernen Webdesigns. Sie ermöglicht es, das gesamte visuelle Erscheinungsbild einer Website durch Änderungen an wenigen CSS-Dateien zu verändern, ohne jeden einzelnen HTML-Inhalt anfassen zu müssen.
Das Wort „Cascading“ (kaskadierend) beschreibt, wie CSS-Regeln priorisiert werden, wenn mehrere Regeln auf dasselbe HTML-Element zutreffen. Die Priorität ergibt sich aus drei Faktoren: Spezifität (ein ID-Selektor hat Vorrang vor einer Klasse, eine Klasse vor einem Element-Tag), Reihenfolge (eine später deklarierte Regel überschreibt eine frühere gleicher Spezifität) und Herkunft (Autoren-Styles schlagen Browser-Standardstyles). Das Schlüsselwort !important kann die Kaskade übersteuern, sollte aber sparsam eingesetzt werden, da es den Code schwer wartbar macht.
Nach CSS 2.1 wechselte das W3C (World Wide Web Consortium) zu einer modularen Entwicklung. Statt einer monolithischen neuen Version gibt es seither individuelle Module, die je im eigenen Tempo standardisiert werden: CSS Selectors, CSS Flexbox Layout, CSS Grid Layout, CSS Animations, CSS Custom Properties (Variablen). Ein „CSS4“ als Gesamtversion existiert nicht; einzelne Module befinden sich auf Level 4 oder höher. Das W3C veröffentlicht jährliche Snapshot-Dokumente, zuletzt CSS 2026, die den aktuellen Implementierungsstand aller Module zusammenfassen.
Beispiel aus der Praxis
Jedes WordPress-Theme enthält eine Datei style.css im Theme-Verzeichnis. Diese Datei beginnt mit einem Kommentarblock, der Theme-Name, Autor und Versionsnummer enthält, und definiert danach alle CSS-Regeln für das visuelle Erscheinungsbild. Wenn Sie die Farbe einer Überschrift ändern möchten, ohne das Theme direkt zu bearbeiten, können Sie über Darstellung > Customizer > Zusätzliches CSS eigene CSS-Regeln eingeben. Diese werden nach den Theme-Styles eingefügt und überschreiben sie dank der Kaskade zuverlässig. Für Block-Themes in WordPress 6.0 und neuer gibt es zusätzlich den Site Editor, in dem globale Stile über eine grafische Oberfläche angepasst und als JSON gespeichert werden.
Tipp aus der Praxis
Beim Debuggen von CSS-Problemen in WordPress hilft die Browser-DevTools-Oberfläche (F12) am schnellsten weiter. Öffnen Sie die DevTools, wechseln Sie zum Inspektor-Tab, klicken Sie auf das problematische Element und beobachten Sie im CSS-Panel, welche Regeln aktiv sind und welche durchgestrichen angezeigt werden. Durchgestrichene Regeln wurden von einer anderen Regel mit höherer Spezifität überschrieben. Im „Computed“-Tab sehen Sie den tatsächlich angewendeten Wert. Achten Sie beim Einsatz von Page-Buildern wie WPBakery oder Elementor darauf, dass diese häufig sehr hochspezifische Inline-Styles direkt im HTML setzen. Diese lassen sich nur mit einer ebenbürtigen CSS-Spezifität oder einem gezielt gesetzten !important überschreiben.