Bootstrap Kompaktkurs

Übersicht und Architektur

• Warum Bootstrap?
• Bootstrap Versionsgeschichte.
• Vor- und Nachteile
• Bestandteile
• Sass

Bootstrap 5 Grid

• Flexbox
• CSS Grid
• Möglichkeiten und Probleme
• Der Container
• Anpassen an verschiedene Bildschirmgrößen
• Inhalte auf mobilen Geräten oder Desktops verstecken
• Gutters (Abstand zwischen Spalten)
• Hilfs-Tools

Bootstrap Komponenten

• Alerts
• Buttons
• Cards
• Tabs
• Accordion
• Modals
• Progress Bars
• Carousels
• uvm.

Bootstrap und Formulare

• HTML5 Input Elemente
• Form Layouts (Horizontal, Vertikal etc.)
• Input Gruppen
• Ranges
• Validierung

Bootstrap Utilities und Helfer

• Margin und Padding
• Borders
• Rundungen
• Farben
• Sichtbarkeit
• Position
• Schatten
• Text
• uvm.

Bootstrap 5 an das eigene Corporate Layout anpassen

• Node und npm
• package.json
• Default Farben, Rundungen und Schatten anpassen (Sass overwrite)
• Eigene CSS Variablen
• Bootstrap 5 erweitern.

Weitere Themen

• Performance Optimierung
• CSS und JavaScript Größe optimieren
• Tipps und Tricks