Flexbox CSS3 в одном видео за 20 минут!
HTML-код
- Опубликовано: 8 сен 2024
- В этом уроке мы с вами рассмотрим все основные моменты Flexbox CSS3 в одном видео всего за 20 минут! Мы научимся позиционировать объекты при помощи свойств Flexbox.
1) Урок на сайте: itproger.com/c...
2) Расширение Emmet: • Пишем код быстро благо...
✔ Основной сайт: itproger.com/
✔ -------------
Группа Вк - prog_life
Группа FaceBook - goo.gl/XW0aaP
Instagram: / gosha_dudar
Я в Google+ - goo.gl/Tqt9W0
Страничка Twitter - / goshadudar
Страничка Вк - codi999
✔ Начните зарабатывать на RUclips - join.air.io/mon...
✔ Видео по заработку на RUclips - goo.gl/RLPXV8
Помощь в развитии канала.
* Яндекс Деньги: 410014343706921
* Кошельки WebMoney:
- Доллар: Z331064341236
- Гривна: U386388718252
- Рубль: R214610220703
Все в одном. Четко, понятно и без воды! Огромный респект вам Гоша!!!
Месяц пытался осилить float'ы...
А тут оказывается есть флексы. Одно удовольствие теперь верстать!))
очень хорошо что ты смотришь Traversy Media ;)
Flexbox CSS In 20 Minutes
Спасибо за наводку. Посмотрела в оригинале, другие уроки у Traversy Media тоже классные, 95% понятно. Но далеко не все будут искать информацию на англ.языке, поэтому Гоше все равно большое спасибо!
Админ - жму руку!
Без воды, четко и по делу!
Большое спасибо за данное видео! Очень все просто и понятно, удачи тебе и делай побольше подобных видосов)
Привет из 2020 года ) Спасибо! Очень всё информативно и доступно...без воды. Лайк и подписка)
Пусть и с опозданием в 3 года, но, спасибо) Я только учусь и думаю, что лучше сразу учиться правильно!)
Как успехи?
Кстати а как насчёт сделать урок по флексбокс с фотографиями ??
Сними курс по созданию полностью функционального веб сайта (Старые курсы уже старые☻)
Это же шикарно. А я ломал голову с флоатами)))
Спасибо большое за видео!🤘🏻
проще некуда! Бро, спасибо!
Спасибо большое за ценный урок:)
Когда уже выйдет "как стать лучшим в мире программистом за 10 минут ,жду не дождусь"
Это все не программирование))0))
Марк Вымышленный да ну, серьезно?))) А я и не знал/)
Про 10 минут ты загнул, конечно. Тут надо час. :DD
@@sadHamster а почему так долго? Туториал с# за 5 минут есть же
Адам Янг между прочим программирование, веб-программирование
От прямо сууупер урок! Реально все зрозуміло та чітко! Дякую
Бомбезный урок
Гоша Дударь вырос как Веб-разработчик чувствуется :) Молодцом)
Спасибо за урок. Все кратко и ясно. Однозначно подписка
Спасибо за хорошее видео, примечание при использование
.box {
flex-basis: 20%;
}
при уменьшение страницы блоки ведут себя как и в видео, но всё меняется когда мы используем width: 20%, стройные ряды рушатся.
Классное видео, очень подробно и доступно) пропустили только align-content и align-self) И по позиционированию можно еще задавать margin: auto дочерним элементам, для сохранения центровки.
Георгий, если не трудно, сможете записать урок "Ruby за час"? Будем вам очень признательны!
Это гениально! Спасибо!
Большое спасибо за урок! Теперь нужно еще ознакомиться с CSS grid и bootstrap
Все быстро и понятно, спасибо )
Спасибо за видео, доступно и кратко!!!
афигенный урок, благодарю!
Вы самый лучший. Единственное понятное объяснение в Интернете
Спасибо, что без воды!
Это просто аху**но , спасибо!
Быстро четко и понятно!
15:21 бог создавая меня
Крутой видосик, очень легко доходит.
офигеть... Я изучал их неделями....
Красава, спасибо Гоша! Как всегда на высоте!
Спасибо за прекрасное объяснение
Полезно!
Коротко и ясно!!! Спасибо!
Спасибо вам
благодарю, лайк!
Отличный - познавательный урок. Абсолютно всё предельно понятно,превосходное объяснение. Одим словом супер. Так держать Гоша!
Для того чтобы не высчитывать ширину или высоту блока, есть чудо свойство box-sizing .. Для тех, кто не знал. :)
Знали все но всё равно флекс в разы удобнее)
Супер доходчиво. Спасибо!
Спасибо автору! Отличный для понимания обзор FlexBox!
В своей работе, когда нужен Флекс, всегда пользуюсь этой шпаргалкой profi.spage.me/css/see-how-flexbox-works-in-css-on-gif-images Здесь есть GIF картинки которые наглядно поясняют то или иное свойство FlexBox. Может кому то пригодиться.
Возьмите CSS Flex в работу, он очень важен для адаптивной разметки сайта. И не так сложен как кажется.
Гошан, респект!
просто спас, долго уже ищу как разместить в ряд, а не в столбик блоки
Благодарю! Всё ясно и просто. Хорошая подача материала!
Красавчик! Хорошее видео!
Лайк за видео, круто перевёл с английского источника
Спасибо, быстро и четко.
Спасибо что ты снимаешь годные видео
BENSON - FLEXBOX!!! BENSON IS A HAPPY CAT
Спасибо за видео, очень хорошо объясняешь.
Спасибо за отличный урок))
Классный инструмент
Спасибо Гоша, разобрался
красава один в один с трэверси медиа только на русском)
отличное видео, подписался!
Было бы 1000 лайков 👍 поставила бы благодарю 🙏
Гошан, спасибо!!
А у меня flexbox практика=)
*Даже тут ты Мармок :з*
А мне нужна как-раз теория. Практику я и сам могу ;)
Уважаю твой канал, реально крут и подписан ))
А у тебя перепис)
Ну тогда переходим к практической части изучения flexbox...
Spasibo
1:49 слушать можно бесконечно!))
спасибо!
super!!!thanks)))
Спасибо просто и понятно
Автору большое спасибо за урок. Понял что медиа-запросы и вёрстка на флекс идут рядом. За адаптивку тоже спасибо. Но хотелось бы, чтобы тема была продолжена. Вёрстка адаптивного сайта на флекс. Вот пример профессиональной адаптивной вёрстки на флекс habr.com/post/314034/
лайк в поддержку
Автор, спасибо, очень наглядно! Но молю тебя 🙏🏻, ставь ударения правильно. РасполОжены, КрасИвее. Пожалуйста!
А ролик - супер. Очень информативный и понятный!
отличное видео! Всё очень детально и информативно.
Единственное что доставляло мне дискомфорт, это произношение автором слова "расположены" с неправильным ударением
Спасибо 😊
Спасибо, много нового узнал
фраза "flexbox - будущее, в которое стоит уже вступить" настораживает)
В слове «расположены» ударение следует ставить на слог с последней буквой О - располо́жены.
красивЕе
Super
блин так круто обисняешь. Так просто
Здравствуйте, ваша видео было очень полезно. Спасибо вам.. Мы очень просим вас снять видео про webkit-animation, в общем webkit...Спасибо ещё раз.....
боже да это же чудо )
Thank u you save my day
Перешёл на flex , а то запарил clearfix
Шикарные видео снимаешь, все понятно и доходчиво и круто, но было бы еще круче если бы ты снял видео уроки по верстке сайта с PSD макета, я искал и нормальных как у тебя уроков найти не могу
thanks
братан, если прописать flex-wrap: wrap-reverse, то не первый блок перенесется, а вообще вся цепочка будет переноситься ВВЕРХ! Попробуй. То есть так же как вниз, только вверх! Так что не путай народ :)
п.с. в смысле последний полезет вверх... ну короче это надо видеть
Спасибо
годно, годно.
отдуши!
В помойку bootsrap grids! Наконец то) Но вопрос, а как с поддержкой в старых браузерах?
Alex Lapin 98%
Нахуй старые браузеры
Ty
Спасибо за видео, я как раз хотел создать адаптивный сайт(первый), теперь это намного легче.А главное вовремя, мне повезло. А можно еще чтоб между этими блоками сверху и снизу промежуток был, с помощью flexbox?
Да, вот только я как-раз тоже создаю сайт и думаю не будет ли каких-либо конфликтов из-за этого в браузерах.
Scietaycin проверь, я думаю что нет...
C помощью margin можно попробуй.
Я добавил, но это уже зависит от того, какой промежуток тебе нужен)
Отлично, жаль что от медиа запросов не получилось отказаться)
Огромное спасибо! Не понимаю тех кто поставил ту дислайк!=\
Но всё ровно спасибо Гоша.
самая главная проблема (лично для меня) это невозможность запомнить какое свойство за что отвечает. уже года 2 периодически использую flexbox, но каждый раз приходится подсматривать как им пользоваться. какие-то сильно не логичные и похожие друг на друга названия у свойств. может плохое знание английского сказывается, но родные css свойста я запомнил очень быстро и помню их даже спустя много времени. с flexbox почему-то так не получается.
Запиши эти слова и запиши их перевод на Русский язык. Не запоминаешь, потому что не знаешь этих слов, вот и все. Если бы вместо width и height надо было писать ширина, высота, то забыть было бы не реально
да, но не совсем. дело не в знании перевода, а именно в нелогичности и не последовательности именования этих свойств. к примеру: flex-direction - все предельно понятно, это flex свойство, отвечающее за направление (я понимаю о чем тут речь и понимаю что делает это свойство) далее flex-wrap - опять flex свойство отвечающее за перенос контента на след строку (я же знаю как работает wrap в css) и потом БАХ justify-content... что это ?? о каком контенте идет речь ? почему не придерживаются ранее заданному шаблону (почему не flex-justyfy например?) затем я вижу align-items и align-content. тут вообще хрен пойми чем контент отличается от объектов?? что именно подразумевал автор, когда давал свойствам такие имена ? это понимаешь ровно пока держишь перед глазами шпаргалку. но спустя месяц всё по новой, заново пытаешься вспомнить что за что отвечает.
заБАВно
Гоша, запили видео-курс по созданию сайта на Python!
Во первых на jango
Во вторых я люблю отвечать на комментарии которым год...
Кот в шляпе Кот в шляпе хДДД
@@Raccoon_ph Во первых на django
Во вторых я люблю отвечать на комментарии которым год...
Такие отступы между блоками, внутри контейнера, как вы показали, нельзя использовать в разработке сайтов.
👍👍👍👍
Важную часть пропустил про flex-grow.
Занятный *flex*
Я думал flexbox это коробка которая флексит
Дякую)
Прив. можешь снять видео про что такое json и api и как они используется, если можно примеры на php!
реформа реклама бомба