Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Lära Ställa in Flexriktning för Layouter | Bemästra Flexbox för Layout
CSS-Grunder

bookStälla in Flexriktning för Layouter

flex-direction-egenskapen gör det möjligt att bestämma i vilken riktning flexobjekt ordnas. Som standard är denna egenskap inställd på row, vilket resulterar i en layout från vänster till höger i webbläsare som använder engelska som standardspråk. Du kan ställa in den till:

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

Följande webbplatsnavigering används som exempel.

row

index.html

index.html

index.css

index.css

copy

row-reverse

index.html

index.html

index.css

index.css

copy

column

Observera bredden på objekten; de täcker hela förälderns bredd.

index.html

index.html

index.css

index.css

copy

column-reverse

index.html

index.html

index.css

index.css

copy
question mark

Vad gör egenskapen flex-direction?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 4. Kapitel 2

Fråga AI

expand

Fråga AI

ChatGPT

Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal

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

bookStälla in Flexriktning för Layouter

Svep för att visa menyn

flex-direction-egenskapen gör det möjligt att bestämma i vilken riktning flexobjekt ordnas. Som standard är denna egenskap inställd på row, vilket resulterar i en layout från vänster till höger i webbläsare som använder engelska som standardspråk. Du kan ställa in den till:

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

Följande webbplatsnavigering används som exempel.

row

index.html

index.html

index.css

index.css

copy

row-reverse

index.html

index.html

index.css

index.css

copy

column

Observera bredden på objekten; de täcker hela förälderns bredd.

index.html

index.html

index.css

index.css

copy

column-reverse

index.html

index.html

index.css

index.css

copy
question mark

Vad gör egenskapen flex-direction?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 4. Kapitel 2
some-alt