CSS: Cascading Style Sheets
Cascading Style Sheets (CSS) ist eine Stylesheet-Sprache, die verwendet wird, um das Erscheinungsbild eines Dokuments zu beschreiben, das in HTML oder XML (einschließlich XML-Dialekten wie SVG, MathML oder XHTML) geschrieben ist. CSS beschreibt, wie Elemente auf dem Bildschirm, auf Papier, in Sprache oder auf anderen Medien dargestellt werden sollen.
CSS gehört zu den Kernsprachen des offenen Webs und ist gemäß W3C-Spezifikationen in Webbrowsern standardisiert. Zuvor erfolgte die Entwicklung verschiedener Teile der CSS-Spezifikation synchron, was die Versionierung der neuesten Empfehlungen ermöglichte. Sie haben vielleicht von CSS1, CSS2.1 oder sogar CSS3 gehört. Es wird nie ein CSS3 oder CSS4 geben; stattdessen ist jetzt alles einfach nur "CSS" mit einzelnen CSS-Modulen, die Versionsnummern haben.
Nach CSS 2.1 erhöhte sich der Umfang der Spezifikation erheblich und der Fortschritt bei den verschiedenen CSS-Modulen begann sich so stark zu unterscheiden, dass es effektiver wurde, Empfehlungen pro Modul separat zu entwickeln und zu veröffentlichen. Anstatt die CSS-Spezifikation zu versionieren, nimmt das W3C jetzt periodisch ein Schnappschuss des neuesten stabilen Zustands der CSS-Spezifikation und des Fortschritts einzelner Module. CSS-Module haben jetzt Versionsnummern oder Levels, wie zum Beispiel das CSS Color Module Level 5.
Tutorials für Anfänger
Unsere Lernen-Web-Entwicklung-Kernmodule enthalten moderne, aktuelle Tutorials, die die Grundlagen von CSS abdecken.
- Ihre erste Website: Inhalt stilisieren
-
Dieser Artikel bietet eine kurze Einführung in CSS und dessen Verwendung, die sich an Personen richtet, die völlig neu in der Webentwicklung sind.
- Grundlagen des CSS-Styles
-
Dieses Modul bietet alle CSS-Grundlagen, die Sie benötigen, um die Technologie effektiv zu erlernen, einschließlich Syntax, Funktionen und Techniken.
- CSS-Textstilisierung
-
Hier betrachten wir die CSS-Textgrundlagen, einschließlich der Einstellung von Schriftart, Fettgedrucktheit, Kursivschrift, Zeilen- und Buchstabenzwischenräumen und Schlagschatten. Wir schließen das Modul ab, indem wir uns anschauen, wie benutzerdefinierte Schriftarten auf Ihrer Seite angewendet und Listen und Links stilisiert werden.
- CSS-Layout
-
Dieses Modul betrachtet Floats, Positionierung, andere moderne Layout-Tools und den Aufbau von responsiven Designs, die sich an verschiedene Geräte, Bildschirmgrößen und Auflösungen anpassen.
Referenz
Die CSS-Referenz ist eine umfassende Referenz für erfahrene Webentwickler, die jede Eigenschaft und jedes Konzept von CSS beschreibt, einschließlich:
- Die Syntax und Formen der Sprache
- Spezifität, Vererbung und der Kaskade
- CSS-Selektoren, einschließlich Pseudo-Elementen, Verschachtelung, Geltungsbereich und Schatten-Teilen
- CSS-At-Regeln, einschließlich Medien und Container-Abfragen
- CSS-Werte und Einheiten Modul, einschließlich numerischer Datentypen, textueller Datentypen und funktionalen Notationen
- Box-Modell und Margenkollaps
- Der umschließende Block
- Stapel- und Blockformatierungs- Kontexte
- Initiale, berechnete, verwendete und tatsächliche Werte
- CSS-Kurzschlüsseleigenschaften
- CSS Flexbox, Mehrspalten- und Rasterlayout
- Animation, Übergänge und Transformationen
Kochbuch
Das CSS-Layout-Kochbuch zielt darauf ab, Rezepte für gängige Layoutmuster zusammenzubringen, die Sie möglicherweise auf Ihren Websites implementieren müssen. Neben der Bereitstellung von Code, den Sie als Ausgangspunkt in Ihren Projekten verwenden können, heben diese Rezepte die verschiedenen Möglichkeiten hervor, wie Spezifikationen für Layouts verwendet werden können und welche Entscheidungen Sie als Entwickler treffen können.
Werkzeuge für die CSS-Entwicklung
- Sie können den W3C CSS-Validierungsdienst verwenden, um zu überprüfen, ob Ihr CSS gültig ist. Dies ist ein unschätzbares Debugging-Tool.
- Firefox Developer Tools ermöglicht es Ihnen, das Live-CSS einer Seite über die Inspektor und Stileditor Werkzeuge anzusehen und zu bearbeiten.
- Die Web Developer Erweiterung für Firefox ermöglicht es Ihnen, Live-CSS auf beobachteten Websites zu verfolgen und zu bearbeiten.
Meta-Bugs
- Firefox: Firefox Bug 1323667