Тёмный

align-content flexbox css / Выравнивание элементов в флексбокс / css flexbox уроки 

Просто: разработка
Подписаться 47 тыс.
Просмотров 5 тыс.
50% 1

align-content flexbox css / Выравнивание элементов в флексбокс / css flexbox уроки
Привет! Сегодня мы рассмотрим свойство align-content из модуля flexbox css. После просмотра этого видео вы будете знать, как работает это свойство, какие значения оно может принимать. верстка с помощью css flexbox значительно упрощает процесс. верстка сайта состоит из блоков, которые должны выравниваться не только одним потоком, то есть все горизонтально или все вертикально, но так же иногда при большом количестве блоков нужно по разному распределять свободное пространство, которое есть в контейнере.
flexbox уроки направлены на улучшение понимания вами флексбокс и flexbox верстка
В этом уроке мы рассмотрим свойства flex-start, flex-end, center, space-between, space-around, space-evenly, stretch

Опубликовано:

 

10 сен 2019

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 46   
@prosto_razrabotka
@prosto_razrabotka 3 года назад
Не забудьте заглянуть сюда: ❓ Запись на консультацию - prosto-razrabotka.ru/ ✨ Telegram канал - t.me/prostorazrabotka/ 🔥 Telegram чат - t.me/prostorazrabotkachat/ Можете добавиться в друзья: 📷 Instagram - instagram.com/vitaliy.kirenkov/ 📘 ВКонтакте - vk.com/vitaliy.kirenkov/ 📗 Facebook - facebook.com/vitaliy.kirenkov/ 📙 LinkedIn - www.linkedin.com/in/kirenkov/ ✏️ Twitter - twitter.com/VitaliyKirenkov/ А так же, подписаться на страницы: 📘 ВКонтакте - vk.com/public195137161/ 📗 Facebook - facebook.com/prostorazrabotka/
@user-ir7sm6oi4o
@user-ir7sm6oi4o 3 года назад
Самый позитивный блогер из этой темы))) так держать.
@technic_and_programming
@technic_and_programming 3 года назад
+++++++++++++++++
@onet1589
@onet1589 4 года назад
Ждем видео по javascript и фреймворкам к нему!
@user-ff3lc1et3u
@user-ff3lc1et3u 3 года назад
Самые полезные видео на этом канале 👍
@user-pc9nv2ek8f
@user-pc9nv2ek8f 4 года назад
JavaScript Пожалуйста и React буду благодарен .Видосы классные!!!
@user-oh9mv7bv1s
@user-oh9mv7bv1s 4 года назад
Виталий, большая благодарность за такие простые и познавательные видео) Сам погружаюсь во frontend, и твой канал прям чувствую как прокачивает меня) начинаю понимать фундамент, это очень ценно) посмотрел все твои видео и с нетерпение жду новых) также начинаю изучать React js и смотрел у ITбороды, что ты тоже на нём работаешь, очень был бы рад, если ты со своим подходом будешь делать и по нему видео) Успехов тебе и пусть твой канал растёт, побольше бы такого хорошего контента без воды)
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Благодарю. Приятно слышать -)
@ea5970
@ea5970 4 года назад
Ты крут))) подача просто уровень БОГ, всё понятно, в конце ролика даже вопросов не осталось
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Спасибо -)
@user-ez5om7pq8k
@user-ez5om7pq8k 4 года назад
Спасибо за контент, хотелось бы больше видеть вёрстку сложных макетов от Вас
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Бесплатные интересные макеты не так просто найти. Скоро я подниму этот вопрос на сообществе, в обсуждении чего-нибудь придумаем.
@vipdeveloper
@vipdeveloper 4 года назад
@@prosto_razrabotka придумали?
@fife3366
@fife3366 4 года назад
Коментик)
@seriousman109
@seriousman109 4 года назад
Спасибо за видео! Кстати, красивые волосы ;)
@vipdeveloper
@vipdeveloper 4 года назад
Ахахах подъебал😂😂
@TheTexPro
@TheTexPro 4 года назад
Спасибо!
@GamesServices
@GamesServices 3 года назад
Thanks
@folickkk
@folickkk 4 года назад
Годно)
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Отлично!)
@agilkerimov
@agilkerimov 4 года назад
Спасибо
@dbuzeninka8005
@dbuzeninka8005 4 года назад
. Просто_разработка { Контент : 100% ; Актуальность : 100% ; Подача : 100% ; Скучность : 0% ; }
@vanya_hrynkiv
@vanya_hrynkiv 4 года назад
*Ждем видео по:* *@media* *JS* *React & Redux* *WebPack* *Ну и анимация в css*
@prosto_razrabotka
@prosto_razrabotka 4 года назад
@media в видео про адаптив есть.
@Alex-iu7ly
@Alex-iu7ly 4 года назад
Привет, спасибо за отличные видео! Вопрос немного не по теме) Какой у тебя MacBook?
@prosto_razrabotka
@prosto_razrabotka 4 года назад
MacBook Pro 2017, 15'
@technic_and_programming
@technic_and_programming 3 года назад
Как называется мелодия в конце?
@user-uh8wt4zi5y
@user-uh8wt4zi5y 3 года назад
Так и не понял как работает значение stretch в данном свойстве. Вы просто сказали что "ничего не изменилось". То-есть это значение по умолчанию?
@roman5336
@roman5336 4 года назад
Посмотрел видео, разве оно не выравнивает относительно ОСНОВНОЙ оси а не вторичной ? А aligh-content отличается от align-item тем что если есть flex-wrap: wrap то align-content (выравнивает) несколько линий?? align-item(для основная оси) делает то же, что justify-content( для вторичной оси). align-content(для основной оси) делает то же, что justify-items(для вторичной оси)
@invisibleworld3307
@invisibleworld3307 4 года назад
Почему я не вижу видео ролик про Bootstrap, ограниченный доступ написано (
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Потому что никто не видит... Но завтра всё будет -)
@user-pn3fc7ic6m
@user-pn3fc7ic6m 4 года назад
Спасибо вам Виталий. Смотрю ваши видео параллельно с прохождением интерактивных курсов на Html академии. Вы закрываете некоторые пробелы, но есть пару вещей которые хотелось бы добавить, чтобы сделать ваш контент просто бесподобным) 1) Относительно данного урока было бы нагляднее элементам задать бордеры и небольшие маргины чтобы они не слипались и более наглядно было понятно, что происходит с элементами внутри родителя над которым мы "шаманим". 2) Так как вы проделываете эту работу в песочнице Codepen, то можно делится с ребятами скриптом с частью из урока. Так ребята смогут протестировать и поиграться самостоятельно, а ещё можно даже не дописывать некоторые строчки и дать ребятам вбить их самостоятельно) Это будут уже настоящие курсы с домашним заданием)) codepen.io/kirill-chunaev/pen/XWrwyYz?editors=1100 Попробовал повторить всю работу что делали и вы, но без подсматривания в видео, хорошая практика. Ещё раз спасибо за то что вы делаете.
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Отсутствие ссылок на кодпен - часть образовательного процесса. Когда человек сам всё пишет, информация лучше усваивается и он следит за изменение внешнего вида после добавления каждого свойства и соответственно лучше понимает и быстрее запоминает.
@vanya_hrynkiv
@vanya_hrynkiv 4 года назад
В чем разница между Sass и Scss?
@prosto_razrabotka
@prosto_razrabotka 4 года назад
Смотрите видео по препроцессорам. Тоже есть на канале -)
@vanya_hrynkiv
@vanya_hrynkiv 4 года назад
@@prosto_razrabotka спасибо
@andrTaylor
@andrTaylor 4 года назад
Нигде не нашёл видеороликов о том, как создаются промо лендинги...очень жду обучающего видоса на эту тему, интересует горизонтальный скролл и интересная красивая анимация, www.richard-hill.org.uk/work более красивых сайтов не нашёл) ru.oollee.com/
@prosto_razrabotka
@prosto_razrabotka 4 года назад
На канале есть видео с вёрсткой макета. Лендинга.
@andrTaylor
@andrTaylor 4 года назад
@@prosto_razrabotka Да, но мне интересна реализация горизонтальной прокрутки на странице, именно касательно скрола ничего не нашёл.
@prosto_razrabotka
@prosto_razrabotka 4 года назад
@@andrTaylor В изначальной версии сообщения не было речи о горизонтальном скролле и таких примерах -) А сайт с водой крут -)
@andrTaylor
@andrTaylor 4 года назад
Просто: разработка да, вы правы, я изменил уже позже своё сообщение потому что искал примеры сайтов.
@MaksimZhatkin
@MaksimZhatkin 4 года назад
Виталий, спасибо большое за контент. Очень радуют твои видео. Но, ради Аллаха, святого духа и Святого Патрика, сделайте шрифт по-больше. Очень тяжело смотреть на телефоне(даже в максимальном разрешении). Еще раз спасибо, продолжайте в том же духе!
@user-pn3fc7ic6m
@user-pn3fc7ic6m 4 года назад
Смотрите с нормального экрана) Ведь "кодить" на телефоне у вас не сильно получится)
@vipdeveloper
@vipdeveloper 4 года назад
Ты над нашей Религий не насмехайся тут
@brunogrb324
@brunogrb324 4 года назад
Когда же bootstrap?
@user-th4qi8iv3q
@user-th4qi8iv3q 6 месяцев назад
ничего не понял
Далее
How To Make Toggle Button Using HTML & CSS
5:27
Просмотров 67 тыс.
CSS Flexbox. Полный курс
59:57
Просмотров 160 тыс.