Übung zu FlexBox
Dauer: 35 Minuten
Übung: 25 Minuten
Besprechung: 10 Minuten
Bauen Sie dieses Kachelmuster bzw. Gemälde von Piet Mondrian mit einem Flexbox-Layout nach:
Quelle: Wikipedia
Bemerkungen:
- Sie können dafür ein neues Projekt in VS Code erstellen oder Codepen verwenden.
- Einzelne Kacheln können durch
div-Elemente mit fester Breite (CSS-Eigenschaftwidth) und Höhe (height) definiert werden. - Die Hintergrundfarbe wird mit
background-colorbestimmt. - Denken Sie auch an die Ränder der Boxen.
(Info für Dozierende: Lösung siehe web-prog im git-Repository exercises)
🤖
Bild in ChatGPT hochladen und HTML/CSS generieren lassen.