Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Вирівнювання Елементів по Вертикалі | Флексбокс
Основи CSS
course content

Зміст курсу

Основи CSS

Основи CSS

2. CSS для Тексту
3. Бокс Модель та Відстань між Елементами
4. Флексбокс
5. Декоративні Ефекти

bookВирівнювання Елементів по Вертикалі

Властивість align-items керує вертикальним розташуванням гнучких елементів. Значення за замовчуванням - stretch.

Давайте розглянемо наступні приклади, щоб зрозуміти, де нам це потрібно.

stretch

Це означає, що ми розтягуємо елементи на всю довжину поперечної осі.

html

index

css

index

js

index

copy

center

Елементи знаходяться в центрі поперечної осі.

html

index

css

index

js

index

copy

flex-start

Всі елементи починаються з початку поперечної осі.

html

index

css

index

js

index

copy

flex-end

Всі елементи знаходяться в кінці поперечної осі (в кінці батьківського flex-контейнера).

html

index

css

index

js

index

copy

baseline

Усі flex-елементи вирівнюються на основі базового рядка їхнього текстового вмісту.

html

index

css

index

js

index

copy
1. Що робить властивість align-items?
2. Які з наведених нижче значень можна використовувати з властивістю align-items?
Що робить властивість align-items?

Що робить властивість align-items?

Виберіть правильну відповідь

Які з наведених нижче значень можна використовувати з властивістю align-items?

Які з наведених нижче значень можна використовувати з властивістю align-items?

Виберіть кілька правильних відповідей

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 4. Розділ 4
some-alt