CSS Flexbox in 5 Minuten erklärt | CSS Tutorial Deutsch

preview_player
Показать описание
Mit dem Coupon-Code: KURZUNDKNAPP
sparst du 10% Rabatt auf alle Webhosting-Pakete mit einer Laufzeit von 12 Monaten und mehr.

Das Flexible Box Layout, auch Flexbox genannt ist ein Layoutmodell, das die Platzverteilung zwischen Elementen regelt. Es ist eine Methode verschiedene Webseitenelemente in Abhängigkeit vom Anzeigebereich anzuordnen. Auf die Art und Weise kann man Sicherstellen, dass die Webseite ordentlich auf den verschiedenen Geräten angezeigt werden kann.

00:00 Grundlagen
00:27 flex-direction
01:15 justify-content
02:35 align-items
02:54 flex-wrap
03:19 grow & shrink
05:03 align-self

Folgendes wurde im Video erklärt:

flex-direction: row; column; row-reverse; column-reverse
justify-content: flex-start; flex-end; center; space-between; space-around; space-evenly;
align-items: flex-start; flex-end; center
flex-wrap: wrap; nowrap;

flex-grow
flex-shrink
flex-basis
= flex

align-self: flex-start; flex-end; center
Рекомендации по теме
Комментарии
Автор

Super erklärt....bisher das beste Video zur Flexbox das ich gefunden habe....

lowenfanmunchen
Автор

Wow, Flexbox super auf den Punkt gebracht! Für mich ist CSS einfach ein lästiger Part mit dem ich mich notgedrungen herumschlagen muss. Daher freut es mich sehr in so kurzer Zeit die Basics erklärt zu bekommen.

andreasstahl
Автор

cool, space-evenly kannte ich noch nicht, wird sofort eingebaut... super erklärt, dankeschön 🙂

bUTschy
Автор

Das ist das beste Video auf ganz Youtube man, einfach seid einem halb Jahr programmierer, und nix von der geilsten Funktion gewusst.
Danke

lamontnoack
Автор

Klasse !!! Knackig und (für mich) sehr verständlich auf den Punkt gebracht. So liebe ich das. Vielen Dank dafür.

klauswildenburg
Автор

Noch nie so simpel erklärt bekommen. Vielen Dank! Hast dir mein Abo in wenigen Sekunden verdient 🙂👍

ralphbednarik
Автор

Alles sehr komprimiert und gut nachzuvollziehen. Schade, dass es nur relativ wenige Klicks hat. Dein Kanal gehört zu den besten in diesem Thema und alle Videos sind leider zu wenig beachtet (hätten wesentlich Besucher mehr verdient!).

alternativ-lostv
Автор

❤️ Dank!
👍 + Abo + 1. Kommentar
Ich habe bis jetzt nur dieses Video von Deinem YT-Kanal gesehen. Wenn all Deine Video von dieser Qualität sind dann hau bitte regelmäßig Video raus, damit YT vielen Leuten Deinen Mehrwert zeigt.

Niko-hzct
Автор

Wirklich top erklärt, aber am besten mehrmals schauen und direkt anwenden👌

erkannn
Автор

Vielen lieben Dank. Sie haben mir extrem geholfen. Extrem gutes Video.

Jasmin-jfsw
Автор

super gutes Video! Kurz und anschaulich

Johann.Liebert
Автор

Wow! Richtig gutes Video! Danke vielmals ;)

codeuwe
Автор

Druckbetankung :-) Sehr gut erklärt und dargestellt!

freizeitreiten
Автор

Muss man die Flexbox-Klasse im <head>-Bereich des HTML-Dokuments einfügen oder kann man es auch in die style.css-Datei einfügen und dann vom HTML-Dokument aus abrufen.

FlashI
Автор

Mache gerade eine Schulung und mein Lehrer kann mir einfach nicht die Definition erklären von Flexbox. Ich musste es mir selbst erklären… echt traurig.

Ist dies normal, wenn man etwas älter ist und Jahre lange Erfahrung hat im Bereich IT?!

Danke für das Video 😊 echt gut erklärt.

abuaaliyah
Автор

Ich hab eine main div und darunter 2 bilder in seperaten Divs.
Die Main Div hat ein display flex und eine width von 100%

Wenn ich jetzt der darunter liegenden child ein Flex-shrink von 1 gebe, weil es über die Div hinaus geht passiert genau 0

Yasaro
Автор

Super Video! Ich finde das neben dem Thema aber auch so cool das sich der Browser automatisch aktualisiert. Gibt es auch ein Video wie man das einrichten kann (virutelle Serverumgebung?). Auch das wenn man die Fenster (VS + Browser) hin und her zieht das sich die Fenster beide automatisch anpassen. Gibt es hier auch ein Tutorial? Ich würde diesen Workflow super gerne übernehmen wollen, but don`t know how it works.

rxjudy
Автор

Wie macht man das die Zahl auch vertikal in der Mitte sich befindet?

terminator
Автор

Hast du die CSS datei noch und evtl die Html Datei?

sanityevolution
Автор

Hi, wahrscheinlich echt ne dumme Frage, aber wie kann man ein Rechteck erstllen und in diesem zum Beispiel ein Bild anordnen?

lionel