CSS für Anfänger ist eine praxisorientierte Einführung in die Gestaltung von HTML mit neun angeleiteten Labs. Sie beginnen mit dem Erstellen und Einbinden eines externen Stylesheets und bauen anschließend einen anwendbaren Wortschatz aus Selektoren und Eigenschaften für Text, Farben, Hintergründe, Abstände, Größen und typische Seitenelemente auf.
Jedes Lab konzentriert sich auf eine kleine sichtbare Änderung, die Sie in der Browservorschau prüfen können. Der Kurs führt von den CSS-Grundlagen über Flexbox, horizontale Listennavigation und besser lesbare Tabellen bis zu einer abschließenden Einführung in Tailwind-CSS-Utilities, die per CDN geladen werden.
Was du lernen wirst
Nach Abschluss dieses Kurses können Sie:
- Ein externes Stylesheet erstellen, mit HTML verknüpfen und Inhalte mit Element-, Klassen-, ID-, Gruppen- und Nachfahrenselektoren ansprechen
- Text mit Farbe, Pixelgröße, Schriftstärke, Ausrichtung, Zeilenhöhe und Schriftfamilie gestalten
- Hexadezimal- und RGB-Farben, Hintergrundbilder, Wiederholungssteuerung und Hintergrundpositionierung anwenden
- Inhaltsbreite, Innenabstand, Rahmen, Außenabstand und
box-sizing: border-boxim CSS-Boxmodell einordnen - Einfache Flexbox-Layouts mit Richtung, Verteilung, Ausrichtung und Umbruchsteuerung erstellen
- Eine Liste in eine horizontale Navigation umwandeln und Tabellen mit Rahmen, Abständen, Kopfzeilen und Ausrichtung lesbarer machen
- Tailwind CSS per CDN laden und grundlegende Utilities für Hintergrund, Text, Innenabstand und Flexbox kombinieren
Für wen dieser Kurs geeignet ist
Der Kurs richtet sich an CSS-Neulinge, HTML-Lernende, die einfache Seiten gestalten möchten, und Entwickler, die die zentralen Mechanismen des Stylings kompakt auffrischen wollen.
Voraussetzungen: Grundkenntnisse zu HTML-Elementen und -Attributen werden empfohlen. Die Labs stellen vorbereitete HTML-Dateien bereit; wenn Sie head, body, div, Listen, Tabellen, Klassen und IDs kennen, können Sie sich auf CSS konzentrieren.
Lernumgebung: Alle neun Labs laufen in einer browserbasierten Ubuntu-22.04-WebIDE mit vorbereiteten Projektdateien und einer Web-8080-Vorschau. Sie bearbeiten HTML und CSS direkt und aktualisieren oder öffnen die Vorschau, um jede visuelle Änderung zu prüfen.
Häufig gestellte Fragen
Muss ich vor dem Kurs HTML beherrschen?
Fortgeschrittene HTML-Kenntnisse sind nicht nötig, Grundlagen sind aber hilfreich, da CSS die HTML-Struktur auswählt und gestaltet. Die Übungen konzentrieren sich auf CSS und stellen das Seiten-Markup in der Regel bereit, statt den Aufbau von HTML-Dokumenten ausführlich zu lehren.
Erstelle ich eine vollständige Website oder ein Portfolio?
Nein. Der Kurs besteht aus neun fokussierten, angeleiteten Labs und enthält weder ein Abschlussprojekt noch eigenständige Challenges. Sie nehmen gezielte Änderungen an vorbereiteten Seiten vor, um das Verhalten einzelner Selektoren und Eigenschaften zu beobachten.
Lehrt der Kurs Responsive Webdesign?
Nur einführend. Das Flexbox-Lab behandelt Richtung, Ausrichtung, Verteilung und Umbruch, die für flexible Layouts nützlich sind. Media Queries, CSS Grid, Breakpoints und ein vollständiger Mobile-first-Ablauf werden jedoch nicht behandelt.
Wie ausführlich wird Tailwind CSS behandelt?
Ein Lab führt Tailwind über das CDN ein und verwendet eine kleine Auswahl an Utilities für Hintergrund, Text, Innenabstand und Flexbox. Installation mit einem Buildwerkzeug, Konfiguration, responsive oder zustandsabhängige Varianten, Komponentendesign und Produktionsoptimierung sind nicht enthalten.
