3. Sitzung
Einleitung
Mehrere HTML Dateien
Kapitel
00:00 - Was müssen wir wissen
00:44 - Wie sind Adressen aufgebaut
03:17 - Dateipfade hinter Adressen
05:09 - Naiver Ansatz andere HTML zu laden
06:30 - Korrekter Ansatz mit Grund
Navigationsleiste
Kapitel
00:00 - Das nav-Element
02:04 - Navigation über Listen
04:08 - Beispiel fürs Styling
div-Elemente
Kapitel
00:00 - div-Elemente als generischer Container
03:18 - Beispiel an Twitter
05:08 - Beispiel an der Uni Köln Seite
IDs und Klassen
Kapitel
00:00 - IDs vergeben
02:03 - Hinweis zur Benennung
03:14 - Style über ID verändern
04:34 - Selbes Ergebnis aber mit Klassen
08:02 - Weiteres Beispiel für Klassen
FlexBox
Sitzungsaufgaben
Die folgenden Spiele dienen zur Vertiefung von Positionierung mit FlexBox und Auswahl von Elementen über Selektoren. Nicht alle Level müssen geschafft werden, aber schaut mal wie weit ihr kommt.
Kapitel
00:00 - FlexBox visualisiert
03:22 - Vorbereitungen
04:14 - Container zu einer FlexBox machen
05:20 - Positionierung in Laufrichtung mit justify-content
07:01 - Weitere Positionierung mit align-items
08:57 - Laufrichtung verändern
10:23 - Aufgabe 1: Flexbox Froggy
11:53 - Aufgabe 2: CSS Diner