FLEXBOX. Учимся верстать на флексах. Флексбокс уроки. Часть вторая - свойства flex-элементов

178162
341
10247
30.10.2019
Описание видео:

Учим верстку на флексах (flexbox)! Что бы обучение было максимально эффективным я создал отдельный плейлист с целой серией выпусков. Последний будет полностью посвящен практическим примерам верстка на flex Flexbox - это целый модуль, содержащий в себе набор свойств и их значений как для родителя flex-контейнера так и для его дочерних элементов flex-элементов. Основным преимуществом гибкой FLEX разметки является возможность изменять ширину/высоту пространство вокруг и порядок flex-элементов, для того чтобы наилучшим образом заполнить доступное пространство flex-контейнера Часть первая - свойства flex-контейнера: 🤍youtu.be/EO8hH_2OwCU Весь плейлист по FLEXBOX 🤍🤍youtube.com/playlist?list=PLM6XATa8CAG5mPV60dMmjMRrHVW4LmV2x 0:00 - Введение 0:18 - Подготовка к уроку 0:48 - align-self 1:54 - order 2:50 - flex-basis 3:45 - flex-grow 4:42 - flex-shrink 5:34 - короткая запись трёх предыдущих свойств 6:02 - Напутствие Спасибо Emil Chapchakchi Получить доступ к плюшкам + поддержать канал: 🤍🤍patreon.com/freelancerlifestyle Telegram канал: 🤍t.me/freelancer_lifestyle или 🤍teleg.run/freelancer_lifestyle Telegram чат по верстке: 🤍t.me/flschat (🤍teleg.run/flschat) Instagram: 🤍🤍instagram.com/freelancer.lifestyle/ Facebook: 🤍🤍facebook.com/freelancerlifestyle/ Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками! Ссылка на канал: 🤍🤍youtube.com/c/freelancerlifestyle «Фрилансер по жизни». Живи, а работай в свободное время! © #фрилансерпожизни #обучение #верстка

Кадры из видео
FLEXBOX. Учимся верстать на флексах. Флексбокс уроки. Часть вторая - свойства flex-элементов
FLEXBOX. Учимся верстать на флексах. Флексбокс уроки. Часть вторая - свойства flex-элементов
FLEXBOX. Учимся верстать на флексах. Флексбокс уроки. Часть вторая - свойства flex-элементов
FLEXBOX. Учимся верстать на флексах. Флексбокс уроки. Часть вторая - свойства flex-элементов
Тэги из видео
Комментарии пользователей:
Максим
2022-09-23 17:49:30

Супер 💙💛

AntiMorgenshtern(ютуб борется со мной)
2022-09-07 08:49:42

как сделать колонки разных размеров, например первая 80% а вторая 20%? если писать flex 1 1 33.333% то они будут одинаковые. так как же сделать разные?

Aleksandr Barabash
2022-09-01 06:54:23

Спасибо! Все понятно и доходчиво! Крутой контент.

Роман Луценко
2022-08-31 21:27:00

добрый день, что бы получить шпоргалку, необходимо спонсировать канал?

Alexsandr Khaladzhy
2022-08-31 11:30:42

лайк за дуже класне відео!

Jason Born
2022-08-09 10:39:10

Спасибо всё как всегда без лишней ненужной воды коротко ясно лаконично, just PERFECT! Спасибо тебе за твой нелёгкий труд!

stop
2022-07-25 05:27:14

За шесть минут разжевал инфу так, как не разжевывают и половина "учителей"! Однозначно топовый красавчик!

adyl duishenbiev
2022-07-19 06:38:00

Спасибо, очень информативно!

Arthur Flexovich
2022-07-04 21:53:07

У тебя крутое рабочее место!

Václav Václav
2022-06-19 20:47:49

Красавчик

Yehor Kolpashchikov
2022-06-14 09:22:00

Жека - красава!

DaviD
2022-06-09 17:02:05

Спасибо за урок

Вадим Кучеренко
2022-06-06 15:38:07

Ордер працює, але чомусь підсвічуєьтся в SCSS червоним, наче помилка якась. Як це можна виправити?

Дарья Юрко
2022-05-22 12:28:46

Все зрозуміло. Дякую

Ttc An
2022-05-17 10:26:19

Запутался с этими флексами. Как я понимаю, эти значения флексов, в основном, используются для создания макета страницы, а в таком виде примера не слишком доходит как оно будет выглядеть в масштабе макета. И я бы в шпаргалке изменил очередность описания свойств flex-basis, flex-grow и flex-shrink, чтобы они шли по порядку быстрой записи, допустим, flex: 0 0 200px;

Oleksandr Vyshnevskyi
2022-05-15 11:45:22

Така цінна інформація простою мовою

Олег
2022-05-05 22:29:51

Спасибо за ваш труд!

Алексей Чернуський
2022-05-05 17:09:22

дякую, корисне відео. 😇

Sviat Bondar
2022-05-03 18:44:26

Дякую за мега корисну інформацію, я твій фанат. А скажи теоретично можна буде в тебе взяти приватний урок якщо щось мені буде прям ну дуже не зрозуміло?

Что ищут прямо сейчас
obs no lag apple pencil 2 hands on archeage интерактивная как удалить подсказки на ютубе apply online form fillup degree 2nd year ip man cookiemine открытие кейсов Sayu Genshin yone vs heimerdinger Equalize (Musical Recording) mpv luxury Kerala flood REACH Mancing ikan di selokan f1ldan nidalee Jungle vs Lillia niko cfg cars cars used dji mavic pro Speeding ZX25R
Похожие видео
05.11.2019
FLEXBOX. Учимся верстать на флексах. Флексбокс уроки. Часть третья - свойство flex-direction

FLEXBOX. Учимся верстать на флексах. Флексбокс уроки. Часть третья - свойство flex-direction

26.12.2019
Все о CSS переходах (transitions) за 16 минут. CSS анимация. Часть первая.

Все о CSS переходах (transitions) за 16 минут. CSS анимация. Часть первая.

24.10.2021
JQUERY ПРОТИВ JAVASCRIPT. Стоит ли учить jQuery в 2021? Что лучше для развития программиста?

JQUERY ПРОТИВ JAVASCRIPT. Стоит ли учить jQuery в 2021? Что лучше для развития программиста?

01.08.2021
Что должен знать JUNIOR FRONTEND разработчик? Быстрый путь & План

Что должен знать JUNIOR FRONTEND разработчик? Быстрый путь & План

04.10.2019
Методология БЭМ за 17 минут. Пример верстки по БЭМ методологии // Фрилансер по жизни

Методология БЭМ за 17 минут. Пример верстки по БЭМ методологии // Фрилансер по жизни

16.10.2018
В чем разница между Float, Flexbox и Grid CSS?

В чем разница между Float, Flexbox и Grid CSS?

24.01.2020
CSS animation и @keyframes за 12 минут. Подробный разбор CSS свойств анимации + шпаргалка.

CSS animation и @keyframes за 12 минут. Подробный разбор CSS свойств анимации + шпаргалка.

13.11.2019
FLEXBOX. Примеры верстки на flex. Учимся верстать на флексах. Часть четвертая - практика

FLEXBOX. Примеры верстки на flex. Учимся верстать на флексах. Часть четвертая - практика

08.06.2021
Flexbox is more complicated than you thought

Flexbox is more complicated than you thought

08.09.2020
Основы синтаксиса JAVASCRIPT. Структура кода. Инструкции. Режим use strict. Уроки JAVASCRIPT с нуля.

Основы синтаксиса JAVASCRIPT. Структура кода. Инструкции. Режим use strict. Уроки JAVASCRIPT с нуля.

15.02.2020
Адаптивные изображения. Практические приемы верстки картинок. CSS object-fit HTML picture.

Адаптивные изображения. Практические приемы верстки картинок. CSS object-fit HTML picture.

20.07.2020
CSS Grid Layout. Свойства определения сетки grid-template и другие

CSS Grid Layout. Свойства определения сетки grid-template и другие

20.10.2019
FLEXBOX. Учимся верстать на флексах. Флексбокс уроки. Часть первая - свойства flex-контейнера

FLEXBOX. Учимся верстать на флексах. Флексбокс уроки. Часть первая - свойства flex-контейнера

05.12.2019
Адаптивная вёрстка сайтов за 37 минут + макет. Тебе не нужен Bootstrap! [ENG SUBS]

Адаптивная вёрстка сайтов за 37 минут + макет. Тебе не нужен Bootstrap! [ENG SUBS]

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

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