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

bookJustera Objekt Vertikalt i Flexbox

Egenskapen align-items styr den vertikala placeringen av flexobjekt. Standardvärdet är stretch.

align-items: stretch | center | flex-start | flex-end | baseline;

Låt oss gå igenom följande exempel för att förstå när vi behöver denna egenskap.

stretch

Det innebär att objekten utökas till hela längden av tväraxeln.

index.html

index.html

index.css

index.css

copy

center

Objekt är centrerade längs tväraxeln.

index.html

index.html

index.css

index.css

copy

flex-start

Alla objekt börjar vid början av tväraxeln.

index.html

index.html

index.css

index.css

copy

flex-end

Alla objekt placeras i slutet av tväraxeln (i slutet av den överordnade flex-behållaren).

index.html

index.html

index.css

index.css

copy

baseline

Alla flexobjekt justeras utifrån baslinjen för deras textinnehåll.

index.html

index.html

index.css

index.css

copy

1. Vad gör egenskapen align-items?

2. Vilka av följande värden kan användas med egenskapen align-items?

question mark

Vad gör egenskapen align-items?

Select the correct answer

question mark

Vilka av följande värden kan användas med egenskapen align-items?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 4. Kapitel 4

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

Awesome!

Completion rate improved to 2.56

bookJustera Objekt Vertikalt i Flexbox

Svep för att visa menyn

Egenskapen align-items styr den vertikala placeringen av flexobjekt. Standardvärdet är stretch.

align-items: stretch | center | flex-start | flex-end | baseline;

Låt oss gå igenom följande exempel för att förstå när vi behöver denna egenskap.

stretch

Det innebär att objekten utökas till hela längden av tväraxeln.

index.html

index.html

index.css

index.css

copy

center

Objekt är centrerade längs tväraxeln.

index.html

index.html

index.css

index.css

copy

flex-start

Alla objekt börjar vid början av tväraxeln.

index.html

index.html

index.css

index.css

copy

flex-end

Alla objekt placeras i slutet av tväraxeln (i slutet av den överordnade flex-behållaren).

index.html

index.html

index.css

index.css

copy

baseline

Alla flexobjekt justeras utifrån baslinjen för deras textinnehåll.

index.html

index.html

index.css

index.css

copy

1. Vad gör egenskapen align-items?

2. Vilka av följande värden kan användas med egenskapen align-items?

question mark

Vad gör egenskapen align-items?

Select the correct answer

question mark

Vilka av följande värden kan användas med egenskapen align-items?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 4. Kapitel 4
some-alt