Aus dem Kurs: Webtechniken lernen 3: Responsive CSS-Layouts mit Media Queries, Flexbox und Grid

So erhalten Sie Zugriff auf diesen Kurs

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 23.200 Kurse von Branchenfachleuten.

Die Reihenfolge von Flex-Items definieren und Zwischenräume festlegen

Die Reihenfolge von Flex-Items definieren und Zwischenräume festlegen

Aus dem Kurs: Webtechniken lernen 3: Responsive CSS-Layouts mit Media Queries, Flexbox und Grid

Gratismonat starten Für Ihr Team erwerben

Die Reihenfolge von Flex-Items definieren und Zwischenräume festlegen

“

Sie haben Eigenschaften zur Kontrolle der Fließrichtung, der Ausrichtung und der Flexibilität kennengelernt. Und jetzt geht es noch um ein paar weitere Eigenschaften zur Gestaltung der Reihenfolge und der Zwischenräume in Flexboxen. Ich wechsle dazu in den Editor und habe hier die Beispieldatei aus dem Ordner zu diesem Film. Sie sehen eine ganz normale ungeordnete Liste mit 4 Listenpunkten: Fließrichtung, Ausrichtung, Flexibilität und Reihenfolge. Und diese Listenpunkte sind ein bisschen gestaltet mit ganz normalem CSS. Die Liste selbst ist ein Flex-Container, und mit flex: 1 sind alle Flex-Items gleich groß geworden. Das ist die Ausgangsposition, und jetzt geht es los mit der Gestaltung der Reihenfolge. Dazu gibt es erst einmal flex-direction, und row ist die Standardeinstellung, da ändert sich überhaupt nichts, aber row-reverse verändert die Reihenfolge und dreht sie einfach um. Das heißt, jetzt ist genau die umgekehrte Reihenfolge von vorher. column verändert die Hauptachse. Jetzt…

Inhalt