CSS Flexbox #11 Практические примеры использования Flexbox (Practical examples)

preview_player
Показать описание
#YauhenK #webDev #CSS #Flexbox

В данном видеокурсе мы с вами рассмотрим технологию Flexbox.
Flexible Box Layout Module (Flexbox) - представляет собой способ компоновки элементов, в основе лежит идея оси. Другими словами все элементы можно располагать вдоль основной и поперечной осей, или вертикально и горизонтально.
Технология позволяет буквально в пару свойств создать гибкий лэйаут, или гибкие UI элементы.

✒ Репозиторий курса:

✒ Полный список готовых и планируемых курсов:

✒ Автор курса:

  1. webDev
  2. web
  3. develop
  4. front-end
  5. frontend
  6. веб
Рекомендации по теме
CSS Flexbox #11 0:06:35

CSS Flexbox #11 Практические примеры использования Flexbox (Practical examples)...

Flexbox CSS практический 0:06:29

Flexbox CSS практический курс за 6 минут. Все свойства

Flexbox и Grid 0:20:51

Flexbox и Grid ⚡️ РЕАЛЬНЫЕ ПРИМЕРЫ, где МОЖНО и НЕЛЬЗЯ использовать CSS Flexbox и Grid...

Flexbox против Grid: 0:01:00

Flexbox против Grid: когда и что лучше использовать? #css #flexbox #grid...

CSS Flexbox. Полный 0:59:57

CSS Flexbox. Полный курс

CSS Flexbox Layout. 0:16:35

CSS Flexbox Layout. Флексы в CSS. Гайд по флексбокс.

FlexBox за 20 0:21:33

FlexBox за 20 минут с примерами // Уроки FlexBox // Bootstrap или FlexBox // Flex css...

Что умеет FLEXBOX 0:08:36

Что умеет FLEXBOX CSS?! Основы верстки на flex

CSS3 Flexbox. Практические 1:21:57

CSS3 Flexbox. Практические примеры

Практические примеры CSS3 1:20:49

Практические примеры CSS3 Flexbox [GeekBrains]

Flexbox CSS самый 1:54:36

Flexbox CSS самый понятный и подробный урок для начинающих на практике...

CSS Grid, flexbox, 0:26:31

CSS Grid, flexbox, float в чем разница и как использовать Практический пример...

Математика это не 0:00:21

Математика это не Ислам

Как прижать футер 0:01:00

Как прижать футер к низу страницы HTML CSS FLEX / Фрилансер по жизни / #Shorts...

Flexbox CSS #1 0:24:18

Flexbox CSS #1 - практика выравнивания элементов

FLEXBOX начало. Флексбокс 0:44:38

FLEXBOX начало. Флексбокс верстка.

CSS Flexbox #1. 0:00:47

CSS Flexbox #1. Что мы будем делать

Динамический разделитель контента 0:06:57

Динамический разделитель контента на flexbox css.

Flexbox для верстки 0:28:25

Flexbox для верстки #6 (практический пример)

CSS Flexbox - 0:27:43

CSS Flexbox - Часть 4 - Вёрстка и примеры использования

Новая 90 версия 0:01:00

Новая 90 версия Chrome, работа с Flexbox CSS Удобно и наглядно #Shorts...

Изучи Flexbox за 0:05:36

Изучи Flexbox за 5 минут

Выучи CSS Позиционирование 0:05:07

Выучи CSS Позиционирование ЗА 5 МИНУТ || CSS Position

В чем разница 0:03:57

В чем разница Flexbox и CSS Grid. Что использовать CSS Grid layout или Flexbox....

Комментарии
Автор

Складно у тебя получается, Женя. Продолжай в том же духе.

HIghtowerSever
Автор

Спасибо за курс 👏👏👏
Была одна проблема. Медиа запрос работал в браузере, но при просмотре в инструментах разработчика в toggle device toolbar он не срабатывал (яндекс браузер и хром). Мучался несколько дней. Оказалось, что надо добавить в <head> строку:
<meta name="viewport" content="width=device-width, initial-scale=1"> (что она означает для меня загадка 😄)
и всё заработало!!!
Может кому-то тоже поможет.

donstacky
Автор

Cпасибо за эти уроки, очень круто, что все не растянуто и по 5-10 минут, гораздо легче сосредоточиться и все усвоить,

darialobanova
Автор

Решил сегодня освежить память по флексам.
Как всегда подача материала отменная. 👍
Большое спасибо за ваш труд!

aleksandr
Автор

Прохожу курс в одной из школ, дабы хоть что то понимать бороздишь просторы интернета.Евгений спасибо огромное за ваши уроки!продолжу изучать ваш материал!

ecizrkz
Автор

Каждое слово на вес золота) Как гладко все зашло и распределилось по местам! Емко, доходчиво и вдохновляюще. Совет по дальнейшему развитию, - как вишенка на торте! :) Благодарю!

maxim-cherkasov
Автор

На этом канале качественный и понятный контент. Я видел платные курсы намного хуже по всем критериям. Я конечно же рад что автор разместил эти обучающие видео в свободном доступе, но думаю что он вполне может размещать эти курсы на платформах, где он мог бы получить за это деньги. Создание такого контента - это труд, и он явно заслуживает финансовое вознаграждение.

HA_CTPIME
Автор

Спасибо за уроки, доходчиво и структурировано

kvieyqd
Автор

Thank you once again, Eugen, you did an awesome job.
Learned a lot from your well-detailed explanations.

garikmelqonyan
Автор

Очень хорошо и доступно, спасибо огромное!!!

chudotech
Автор

Отличный курс, все доступно и понятно, осталось только при помощи практики запомнить основные св-ва, спасибо !

uobbusc
Автор

Юзаю на практике Flex уже несколько лет для своих мини проектов. Данный курс привлек краткостью, информативностью и наглядностью.. Посмотрел меньше чем за час. Особая благодарность за flex и order

bring_you_up
Автор

Cпасибо за уроки. Надеюсь эти знания приблизят к работе web deva))

TRZmax
Автор

классно! очень удобно изучать! теперь практика и на следующий курс - Grid!

EugenySubbotin
Автор

Супер - пересмотрел и по верстке и по flex все уроки. А подскажите по гридам есть у вас или планируете может?

leader
Автор

По поводу модалки, все хорошо, но есть проблема. Пример, в форме много полей по высоте, допустим форма может занять 650 пик по высоте. Влексами она центрируется, но, если допустив высота окна браузера уменьшится по высоте до 400 пик, то шапка формы выходи за верхнюю границу экрана и обрезается вместе с кнопкой закрыть. Можно ли как то сделать, чтобы верхняя часть формы не уходила за рамки экрана и не обрезалась?

fanfish
Автор

Как поведет себя див с атрибутом фиксед, в диве с атрибутом флекс 300 пикселей по центре?

fbwjget
Автор

А если слово main не помещается в 1 строку, как сделать его перенос?

kostya