Grundlagen · Eingangsklasse
Responsives CSS
In dieser Lerneinheit erarbeitest du Responsives CSS und wendest das Wissen anschließend in vier eigenen Aufgaben an.
Zentrale Begriffe
- Kaskade
- Flexbox
- Grid
- Media Query
Das kannst du danach
- Du kannst ein flexibles, gut lesbares Layout für kleine und große Ansichten gestalten.
- Du kannst einen Lösungsweg fachsprachlich nachvollziehbar begründen.
Verständlich erklärt
Responsives CSS passt Anordnung und Abstände an verfügbare Fläche und Nutzerpräferenzen an. Flexible Größen und robuste Layoutsysteme vermeiden horizontales Scrollen.
Eigenes Beispiel
.karten { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }Typische Fehler
- Feste Breiten für alle Geräte erzwingen
- Inhalte nur über Farbe unterscheiden
Kurz zusammengefasst
Du kannst ein flexibles, gut lesbares Layout für kleine und große Ansichten gestalten.
Abi-Check
Prüfe, ob du Begriff, Ablauf und eine typische Anwendung erklären kannst.