Добавил:
piv0405
Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз:
Предмет:
Файл:Лекция 5. Основы flexbox.pptx
X
- •Основы флексбокс
- •сходное состояние
- •ключаем флексбокс
- •Терминология
- •аправление главной оси
- •flex-direction
- •лексбокс и блочная модель 7
- •Определение базовых размеров9
- •Определение базовых размеров10
- •Изменение размеров гибких элементов12
- •flex-grow
- •Один жадный элемент
- •есколько жадных элементов
- •Использование flex-grow
- •flex-shrink
- •2.2. Автоматические отступы
- •margin: auto
- •2.3. Выравнивание элементов
- •ыравнивание вдоль главной оси
- •justify-content
- •ыравнивание поперёк главной оси 23
- •align-items
- •align-items
- •гоистичное выравнивание, align-self26
- •лгоритм раскладки во флексбоксах27
- •3. Ограничение размеров
- •остроение сеток на флексбоксах
- •остроение сеток на флексбоксах
- •остроение сеток на флексбоксах
- •остроение сеток на флексбоксах
- •остроение сеток на флексбоксах
- •остроение сеток на флексбоксах
- •Порядок элементов, order
- •Сокращённая запись flex
- •Ссылки
Изменение размеров гибких элементов12
flex-grow |
13 |
|
Один жадный элемент |
14 |
|
есколько жадных элементов |
15 |
|
Использование flex-grow |
16 |
|
flex-shrink |
17 |
|
2.2. Автоматические отступы |
18 |
|
margin: auto |
19 |
|
Важно запомнить, что свойства для выравниваний и распределений срабатывают после автоматических отступов.
2.3. Выравнивание элементов |
20 |
|
ыравнивание вдоль главной оси |
21 |
|
Соседние файлы в предмете Программирование на HTML/CSS/JavaScript (Веб-разработка)
