CSS: Cascading Style Sheets

Cascading Style Sheets (CSS) ist eine Stylesheet-Sprache, die verwendet wird, um die Präsentation eines Dokumentes zu beschreiben, das in HTML oder XML (einschließlich XML-Dialekten wie SVG, MathML oder XHTML) geschrieben wurde. CSS beschreibt, wie Elemente auf dem Bildschirm, auf Papier, in der Sprache oder auf anderen Medien dargestellt werden sollen.

CSS gehört zu den Kernsprachen des offenen Webs und ist über Webbrowser gemäß W3C-Spezifikationen standardisiert. Früher wurde die Entwicklung verschiedener Teile der CSS-Spezifikation synchron durchgeführt, was eine Versionierung der neuesten Empfehlungen ermöglichte. Sie haben vielleicht von CSS1, CSS2.1 oder sogar CSS3 gehört. Es wird niemals ein CSS3 oder CSS4 geben; vielmehr gibt es jetzt nur noch "CSS" mit einzelnen CSS-Modulen, die Versionsnummern haben.

Nach CSS 2.1 nahm der Umfang der Spezifikation erheblich zu und der Fortschritt bei verschiedenen CSS-Modulen begann sich so stark zu unterscheiden, dass es effektiver wurde, Empfehlungen separat pro Modul zu entwickeln und zu veröffentlichen. Anstatt die CSS-Spezifikation zu versionieren, nimmt das W3C nun periodisch eine Momentaufnahme vom neuesten stabilen Zustand der CSS-Spezifikation und den Fortschritt der einzelnen Module. CSS-Module haben jetzt Versionsnummern oder Level, wie z. B. CSS Color Module Level 5.

Wichtige Ressourcen

CSS-Einführung

Wenn Sie neu in der Webentwicklung sind, lesen Sie unbedingt unseren Artikel CSS-Grundlagen, um zu lernen, was CSS ist und wie es verwendet wird.

CSS-Tutorials

Unser CSS-Lernbereich enthält eine Fülle von Tutorials, die Sie vom Anfängerniveau zur Beherrschung führen und alle Grundlagen abdecken.

CSS-Referenz

Unsere CSS-Referenz beschreibt jede Eigenschaft und jedes Konzept von CSS.

Tutorials

Unser CSS-Lernbereich bietet mehrere Module, die CSS von Grund auf lehren — keine Vorkenntnisse erforderlich.

CSS erste Schritte

CSS (Cascading Style Sheets) wird verwendet, um Webseiten zu gestalten und anzuordnen — zum Beispiel, um die Schriftart, Farbe, Größe und den Abstand Ihres Inhalts zu ändern, ihn in mehrere Spalten zu unterteilen oder Animationen und andere dekorative Merkmale hinzuzufügen. Dieses Modul bietet einen sanften Einstieg auf Ihrem Weg zur CSS-Meisterschaft mit den Grundlagen, wie es funktioniert, wie die Syntax aussieht und wie Sie beginnen können, es zu verwenden, um HTML zu stylen.

CSS-Bausteine

Dieses Modul setzt dort fort, wo CSS erste Schritte aufgehört hat — jetzt, da Sie sich mit der Sprache und ihrer Syntax vertraut gemacht haben und einige grundlegende Erfahrungen mit ihrer Verwendung gesammelt haben, ist es an der Zeit, ein bisschen tiefer einzutauchen. Dieses Modul befasst sich mit der Kaskade und Vererbung, allen verfügbaren Selektortypen, Einheiten, Größenanpassung, Hintergrund- und Rahmenstilen, Fehlerbehebung und vielem mehr.

Das Ziel hier ist es, Ihnen ein Toolkit zum Schreiben von kompetentem CSS bereitzustellen und Sie alle wesentlichen Theorien verstehen zu lassen, bevor Sie zu spezifischeren Disziplinen wie Textgestaltung und CSS-Layout übergehen.

CSS Textgestaltung

Nachdem die Grundlagen der CSS-Sprache behandelt wurden, ist das nächste Thema, auf das Sie sich konzentrieren sollten, die Textgestaltung — eines der häufigsten Dinge, die Sie mit CSS tun werden. Hier betrachten wir die Grundlagen der Textgestaltung, einschließlich Schriftart, Fettung, Kursivschrift, Zeilen- und Buchstabensperrung, Schlagschatten und andere Texteigenschaften. Wir schließen das Modul ab, indem wir uns die Anwendung benutzerdefinierter Schriftarten auf Ihre Seite ansehen und Listen und Links gestalten.

CSS-Layout

An diesem Punkt haben wir bereits grundlegende CSS-Konzepte betrachtet, wie man Text gestaltet und wie man die Kästen manipuliert, in denen sich Ihr Inhalt befindet. Jetzt ist es an der Zeit, zu betrachten, wie Sie Ihre Kästen im Verhältnis zum Ansichtsfenster und zueinander platzieren. Wir haben die notwendigen Voraussetzungen behandelt, so dass wir jetzt tief in das CSS-Layout eintauchen können, unterschiedliche Anzeigeeinstellungen betrachten, moderne Layout-Tools wie flexbox, CSS-Grid und Positionierung sowie einige der Legacy-Techniken, die Sie vielleicht noch kennen sollten.

Verwenden Sie CSS, um häufige Probleme zu lösen

Dieses Modul bietet Links zu Inhaltsabschnitten, die erklären, wie Sie CSS verwenden können, um häufige Probleme bei der Erstellung einer Webseite zu lösen.

Referenz

Die CSS-Referenz ist eine umfassende Referenz für erfahrene Webentwickler und beschreibt jede Eigenschaft und jedes Konzept von CSS, einschließlich:

Kochbuch

Das CSS-Layout-Kochbuch zielt darauf ab, Rezepte für gängige Layout-Muster zusammenzubringen, die Sie möglicherweise auf Ihren Websites umsetzen müssen. Zusätzlich zum Bereitstellen von Code, den Sie als Ausgangspunkt in Ihren Projekten verwenden können, heben diese Rezepte die verschiedenen Möglichkeiten hervor, wie Layout-Spezifikationen verwendet werden können und welche Entscheidungen Sie als Entwickler treffen können.

Tools für die CSS-Entwicklung

Meta Fehler

Siehe auch