Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Leer De Flexrichting Instellen voor Lay-outs | Flexbox Beheersen voor Lay-outs
CSS-Grondbeginselen

bookDe Flexrichting Instellen voor Lay-outs

De eigenschap flex-direction stelt ons in staat om de richting te bepalen waarin flex-items worden gerangschikt. Standaard is deze eigenschap ingesteld op row, wat resulteert in een links-naar-rechts indeling in browsers die Engels als standaardtaal gebruiken. U kunt deze instellen op:

flex-direction: row | column | row-reverse | column-reverse;

Beschouw de volgende website-navigatie als voorbeeld.

row

index.html

index.html

index.css

index.css

copy

row-reverse

index.html

index.html

index.css

index.css

copy

column

Let op de breedte van de items; ze beslaan de volledige breedte van de ouder.

index.html

index.html

index.css

index.css

copy

column-reverse

index.html

index.html

index.css

index.css

copy
question mark

Wat doet de eigenschap flex-direction?

Select the correct answer

Was alles duidelijk?

Hoe kunnen we het verbeteren?

Bedankt voor je feedback!

Sectie 4. Hoofdstuk 2

Vraag AI

expand

Vraag AI

ChatGPT

Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.

Suggested prompts:

Can you explain the difference between each flex-direction value with examples?

How does changing the flex-direction affect the layout of my list items?

Are there any best practices for choosing a flex-direction in navigation menus?

Awesome!

Completion rate improved to 2.56

bookDe Flexrichting Instellen voor Lay-outs

Veeg om het menu te tonen

De eigenschap flex-direction stelt ons in staat om de richting te bepalen waarin flex-items worden gerangschikt. Standaard is deze eigenschap ingesteld op row, wat resulteert in een links-naar-rechts indeling in browsers die Engels als standaardtaal gebruiken. U kunt deze instellen op:

flex-direction: row | column | row-reverse | column-reverse;

Beschouw de volgende website-navigatie als voorbeeld.

row

index.html

index.html

index.css

index.css

copy

row-reverse

index.html

index.html

index.css

index.css

copy

column

Let op de breedte van de items; ze beslaan de volledige breedte van de ouder.

index.html

index.html

index.css

index.css

copy

column-reverse

index.html

index.html

index.css

index.css

copy
question mark

Wat doet de eigenschap flex-direction?

Select the correct answer

Was alles duidelijk?

Hoe kunnen we het verbeteren?

Bedankt voor je feedback!

Sectie 4. Hoofdstuk 2
some-alt