CSS/Tutorials/Ausrichtung
- 4x30min
- mittel
- • HTML
• CSS
Der Kurs Einstieg in CSS bietet die ersten Schritte in der Gestaltung von Webseiten.
Dieser Kurs baut darauf auf und behandelt die Positionierung und Ausrichtung von Elementen mit CSS. Sie können Elemente innerhalb des Dokumentes verschieben und dabei festzulegen, wie diese vom Text umflossen werden sollen. So ist es zum Beispiel möglich, Navigationsleisten ans Ende des Quelltextes zu setzen und den Inhalt nach vorn, obwohl es letztlich im Dokument genau anders herum sein soll.
Der Kurs soll die wichtigsten Eigenschaften an best practice-Beispielen vorstellen und helfen, typische Anfängerfehler zu vermeiden.
- display
- der Elementfluss
- Block oder inline?
- inline-block!
- position
- top, right, bottom und left
- absolute Positionierung
- fixer footer
- sticky footer
- float und clear
- Positionierung mit float
- clearfix
- Exclusions mit Shapes
- Umfließen unregelmäßiger Elemente
- shape-outside
- shape-margin
- shape-image-threshold
- z-index
- Stapelkontext
- Inhalte zentrieren
- align-content
- Grid + Flexbox
- ältere Varianten
Die hier vorgestellte Positionierung mit display, position und float dient der Ausrichtung einzelner Elemente im Elementfluss.
Eine Gestaltung von Webseiten mit diesen Methoden ist heute eher unüblich. Stand der Technik ist eine Umsetzung mit Flexbox oder dem Grid Layout:
