CSS: Cascading Style Sheets
Cascading Style Sheets (CSS) ist eine Stylesheet-Sprache, die verwendet wird, um die Präsentation 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 gerendert werden sollten.
CSS gehört zu den Kernsprachen des offenen Webs und wird gemäß den W3C-Spezifikationen in Webbrowsern standardisiert. Früher wurde die Entwicklung verschiedener Teile der CSS-Spezifikation synchron durchgeführt, was die Versionierung der neuesten Empfehlungen ermöglichte. Sie haben vielleicht von CSS1, CSS2.1 oder sogar CSS3 gehört. Es wird jedoch nie ein CSS3 oder CSS4 geben; stattdessen heißt alles jetzt einfach "CSS", wobei einzelne CSS-Module Versionsnummern haben.
Nach CSS 2.1 hat sich der Umfang der Spezifikation erheblich erweitert und der Fortschritt der verschiedenen CSS-Module 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, erstellt das W3C nun regelmäßig eine Momentaufnahme des aktuellen stabilen Zustands der CSS-Spezifikation und des Fortschritts einzelner Module. CSS-Module haben nun Versionsnummern oder Level, wie zum Beispiel das CSS Color Module Level 5.
Tutorials für Anfänger
Unsere Lern-Webentwicklung Kernmodule enthalten moderne, aktuelle Tutorials, die die Grundlagen von CSS abdecken.
- Ihre erste Website: Gestaltung des Inhalts
-
Dieser Artikel bietet eine kurze Einführung darüber, was CSS ist und wie man es verwendet, und richtet sich an Personen, die völlig neu in der Webentwicklung sind.
- Grundlagen der CSS-Gestaltung
-
Dieses Modul vermittelt Ihnen alle CSS-Grundlagen, die Sie benötigen, um die Technologie effektiv zu erlernen, einschließlich Syntax, Funktionen und Techniken.
- CSS-Textgestaltung
-
Hier betrachten wir die Grundlagen der CSS-Textgestaltung, einschließlich der Einstellung von Schriftarten, Fettschrift, Kursivschrift, Zeilen- und Buchstabensperrung sowie Schlagschatten. Wir runden das Modul ab, indem wir betrachten, wie benutzerdefinierte Schriftarten auf Ihrer Seite angewendet werden, und wie Listen und Links gestaltet werden.
- CSS-Layout
-
Dieses Modul untersucht Floats, Positionierung, andere moderne Layout-Tools und den Aufbau responsiver 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:
- Der Syntax und Formulare der Sprache
- Spezifität, Vererbung und der Cascade
- CSS-Selektoren, einschließlich Pseudoelemente, Verschachtelung, Scoping und Schattenkomponenten
- CSS At-Rules, einschließlich Media und Container Abfragen
- CSS-Werte und Einheiten Modul, einschließlich nummerischer Datentypen, textlicher Datentypen und funktionaler Notationen
- Box-Modell und Kollabieren von Rändern
- Der einschließende Block
- Stapeln und Block-Formatierung Kontexte
- Initiale, berechnete, verwendete und tatsächliche Werte
- CSS Shorthand-Eigenschaften
- CSS Flexibilitätsbox, Mehrspalten und Grid Layout
- Animation, Übergänge und Transformationen
Kochbuch
Das CSS-Layout-Kochbuch hat das Ziel, Rezepte für gängige Layoutmuster zusammenzubringen, die Sie möglicherweise in Ihren Seiten implementieren müssen. Neben dem Bereitstellen von Code, den Sie als Ausgangspunkt für Ihre Projekte verwenden können, heben diese Rezepte die verschiedenen Möglichkeiten hervor, wie Layout-Spezifikationen genutzt werden können und welche Entscheidungen Sie als Entwickler treffen können.
Werkzeuge für die CSS-Entwicklung
- Sie können den W3C CSS Validation Service verwenden, um zu überprüfen, ob Ihr CSS gültig ist. Dies ist ein unverzichtbares Debugging-Tool.
- Die Firefox Developer Tools ermöglichen es Ihnen, das live CSS einer Seite über die Inspector und Style Editor Werkzeuge anzusehen und zu bearbeiten.
- Die Web Developer Erweiterung für Firefox ermöglicht es Ihnen, live CSS auf überwachten Seiten zu verfolgen und zu bearbeiten.
Meta-Bugs
- Firefox: Firefox Bug 1323667