Как сверстать выпадающее многоуровневое меню

  Рет қаралды 17,184

От 0 до 1

От 0 до 1

Жыл бұрын

Кенты, верстка многоуровневого меню на повестке дня! Очень часто бывает такая вечеринка, когда есть многостраничный сайт, и заказчик хочет впихнуть туда всю историю своей жизни. Тут без многоуровневого меню не обойтись! В этом видео вы научитесь это делать и вычеркнете эту задачу со списка "Надо бы разобраться"
Мой курс по верстке:
from0to1.com.ua/
Телеграм канал - t.me/from0to1com
Подпишитесь на канал, если вам понравилось данное видео:
bit.ly/2IFzwBZ

Пікірлер: 91
@AlexLee-do4min
@AlexLee-do4min Жыл бұрын
Вадим, ты супер! Иногда включаю твои видосы просто для наслаждения и отдыха. Твоё общение со зрителем само по себе доставляет расслабуху и живой кайф! Благодарю за твой труд - он приносит людям пользу!
@movieclips4848
@movieclips4848 Жыл бұрын
Продолжайте делать такие мини уроки
@onlydropped6479
@onlydropped6479 Жыл бұрын
Как давно я ждал такой урок. Вадим, спасибо!
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
все для тебя=)
@drawusoon
@drawusoon Жыл бұрын
Блин Вадос, выздоравливай, по голосу слышно что не всё будь здоров, ты там давай не болей дружище!
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
окей, спасибо
@user-sv7us6sq2f
@user-sv7us6sq2f Жыл бұрын
Спасибо за урок, думаю многим понравился такой формат , очень позновательно . Еще хотим подобные интересные фишки !
@user-kh7fv5rn1g
@user-kh7fv5rn1g Жыл бұрын
Я бы еще добавила стрелочку тем li, в которых есть подменю . а так урок супер понятный, беру на заметку 👍
@zhannavasylievasandshow5129
@zhannavasylievasandshow5129 9 ай бұрын
Спасибо за урок, отличная подача информации 👍
@dimondimonov6417
@dimondimonov6417 Жыл бұрын
Есть вечеринка. Кокрас мне это нужно)))
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
отлично
@serkilovtech
@serkilovtech Жыл бұрын
ты как отец, лучшая подача материала!! Продолжай в том же духе
@BEKS705
@BEKS705 Жыл бұрын
Вадос, огромное спасибо за видос!!!!!!!!!!!! Много времени провел в поисках верстки выпадающего меню.... Все понятно, просто и доступно, а самое главное что без лишних замарочек и качелей. И в продолжении темы хотелось бы посмотреть адаптив к этому меню!!!! Еще раз спасибо за видос!!! Очень ждал его!
@old_dio
@old_dio Жыл бұрын
Спасибо за контент, очень полезно
@Clever_Web-sites
@Clever_Web-sites Жыл бұрын
Спасибо, актуально для меня, канал находка )
@natashawebconstanta777
@natashawebconstanta777 Жыл бұрын
Благодарю!!! Это огонь!! С вашей вечеринкой и адаптив хорошо идёт (если чуток поколдовать))) О, боги... я сделала это ... Спасибо =)
@vimvexvimvex8780
@vimvexvimvex8780 Жыл бұрын
Автоматом уже лайк до просмотра ну и Спасибо конечно! Здоровья и благополучия.
@user-xi1gj4ju9f
@user-xi1gj4ju9f Жыл бұрын
Вадос выздоравливай✊ Спасибо большое за контент
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
спасибо, я по быстрому)
@felion111
@felion111 Жыл бұрын
Отличный ролик!
@sychpetr8394
@sychpetr8394 Жыл бұрын
Годный контен спасибо +++.
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
спасибо
@MonteCrush.
@MonteCrush. Жыл бұрын
Веселуха начнётся когда это все надо будет адаптировать для мобилок))
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
та мы на все способны =)
@MonteCrush.
@MonteCrush. Жыл бұрын
​@@vadymprokopchuk Запиши видос🙃
@technic_and_programming
@technic_and_programming Жыл бұрын
Спасибо большое
@VladimirOnokhov
@VladimirOnokhov Жыл бұрын
thanks for the lesson!
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
thanks
@Guy_161
@Guy_161 Жыл бұрын
Спасибо👍
@croshpin
@croshpin Жыл бұрын
ШЕДЕВРРРРР!!!
@user-sf7lz8fn4r
@user-sf7lz8fn4r Жыл бұрын
Спасибо, не приходилось верстать такие менюшки, теперь буду знать такой принцип. Если знаешь про Foundation Zubr, мне было бы интересно посмотреть как ты сверстаешь простой лендинг
@Francija-Bez-Rozovyx-Ochkov
@Francija-Bez-Rozovyx-Ochkov Жыл бұрын
Спасибо друг за очередную годноту! Благодаря твоим видео, я могу уже простенькие сайты открытки делать. По чуть чуть иду к нмеченной цели Верстальщика !
@IvanIvanov-ps5iz
@IvanIvanov-ps5iz Жыл бұрын
Сколько учишься уже что научился верстать простенькие сайты, недель или месяцев?
@Francija-Bez-Rozovyx-Ochkov
@Francija-Bez-Rozovyx-Ochkov Жыл бұрын
@@IvanIvanov-ps5iz пол года учусь по видео в ютубе, нехватает времени из-за работы, так бы был бы лучше эффект в обучении
@mefioz2397
@mefioz2397 Жыл бұрын
спасибо дружище 👍 вот вы бы показали бы еще про vue 😎 верстка вещь лёгкая, база есть да и опыт а вот вьюшка уже вещь интересная
@user-qn9mb7ex7b
@user-qn9mb7ex7b Жыл бұрын
Даёшь видос по шаблонизаторам HTML! подробный, было бы здорово! Классный видос!
@movieclips4848
@movieclips4848 Жыл бұрын
Как всегда топ
@fakesega6730
@fakesega6730 7 ай бұрын
Вадос выручает как никогда)
@user-sq9pf4qq8p
@user-sq9pf4qq8p Жыл бұрын
Вадим, большое спасибо! Подскажите а будет мобильная версия многоуровнего меню?
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
та я вот смотрю по коментам что многие хотят
@user-kf6nh7cq3t
@user-kf6nh7cq3t 7 ай бұрын
@@vadymprokopchuk в мобилке без js не обойтись?
@xeder2932
@xeder2932 Жыл бұрын
спасибо)👍
@vladmvp8140
@vladmvp8140 Жыл бұрын
Топ контент! Дякую 👍
@constyak9031
@constyak9031 Жыл бұрын
классное видео. было бы круто если бы рассказал что делать на моб. устройствах. как откл. hover чтобы не тыкать два раза. стрелку нарисовать, чтобы было понятно, что у меню есть подменю. спасибо за классную подачу
@fedordostoevskiy4209
@fedordostoevskiy4209 Жыл бұрын
Вадим, очень бы хотел с тобой работать! Прикольный ты мужик. 👍
@st.wander4053
@st.wander4053 Жыл бұрын
Буквально 2 дня назад ломал голову с многоуровневым списком. Много что не получалось сделать, по итогу сделал на тяп ляп*( Но сейчас, смотря видос, рили разобрался
@246Dron
@246Dron 7 ай бұрын
Интересно как у тебя в мобильной версии работает многоуровневое меню
@st.wander4053
@st.wander4053 7 ай бұрын
@@246Dron да никак) в проекте были свои сложности, в итоге вообще пришлось все на вордпресс пересаживать, так что менюшка вообще похерилась😭 но эт давно было, даже и вспоминать мучения не хочется
@kubris.developer
@kubris.developer 7 ай бұрын
Вадим, спасибо, всё чётко, как всегда! Что за настройки у EMMET-а, что он разворачивает список построчно?
@TamaraNikolaevna
@TamaraNikolaevna Жыл бұрын
Вадим, большое спасибо! Всё понятно. Давно подписана на вашу страницу. А что надо сделать, чтобы при открытии ссылок меню было видно какая ссылка открывает следующее подменю? Если надо добавить стрелку, то как это написать?
@semen_spider
@semen_spider Жыл бұрын
Вадос ти Бог! 💪💪💪👍👍👍
@user-vr4ps7do2u
@user-vr4ps7do2u Жыл бұрын
Класс
@veterok54
@veterok54 Жыл бұрын
Не хватает адаптива( В данных блоках адаптив сложный, а не десктоп
@Pod_Pro_0
@Pod_Pro_0 Жыл бұрын
А можешь пожалуйста сделать видео про бургер меню Я тебя очень сильно прошу я только твои ролики понимаю
@natalia_0729
@natalia_0729 Жыл бұрын
Бургер меню, но многоуровневое, было бы круто
@dimondimonov6417
@dimondimonov6417 Жыл бұрын
На марафоне есть у него бургер меню как делать
@user-fl1pk6jf9f
@user-fl1pk6jf9f Жыл бұрын
Спасибо Амбассадорам HTML за видео.
@user-vj3cu3wv9l
@user-vj3cu3wv9l Жыл бұрын
кстати я тоже заболел) выздоравливай
@movieclips4848
@movieclips4848 Жыл бұрын
Сделайте серию уроков как это сделать например accordion, popup, переключения фона на сайте
@MelkoR4111
@MelkoR4111 Жыл бұрын
таких видео навалом) у Вадима на канале он много раз делал
@kerusdc8322
@kerusdc8322 Жыл бұрын
не хватает стрелочек напротив пункта с вложенными пунктами чтоб не гадать, где есть новая вложенность, а где нет
@VladimirSalygin
@VladimirSalygin Жыл бұрын
Спасибо! адаптив будет?
@bohdanbatsenko4843
@bohdanbatsenko4843 Жыл бұрын
На этой вечеринке должна была зажигать ЖС и Мобилочка. Бургер также, как модный перец и гвоздь программы. Они вместе должны хорошо танцевать клубняк. Менюшечка ведь на мобиле должна работать
@natalialiakhovych
@natalialiakhovych Жыл бұрын
Кєнт топчік 😄
@kharisovruslan5523
@kharisovruslan5523 Жыл бұрын
👍👍👍
@igorkroshkin9354
@igorkroshkin9354 Жыл бұрын
угу, меню работает - а что будет на мобильных? КАК оно будет работать?
@MelkoR4111
@MelkoR4111 Жыл бұрын
анимация прикольная, но на телефонах и тачпадах все это не работает, нужно делать по клику.
@BMikel
@BMikel 11 ай бұрын
Вадос есть дельное предложение. Вместо примитивных макетиков, сверстать что-нибудь на уровень выше. Я о чем. Многоуровневое мега меню, с адаптивом. Чтоб все схлопывалось и работало на мобиле. Точнее, целый хедер. На пример, как в интернет магазах (розетка, фокстрот, комфи, амазон и т д). Там тебе и каталог, и блог с превьюшками статей. Крч это будет агонь. Сейчас такого нигде нет на БТ.
@fobianka2131
@fobianka2131 11 ай бұрын
не могу понять как сделать, чтобы выезжающее меню раздвигало соседние блоки (другоой контент), к примеру в футере, когда один под другим идёт
@fobianka2131
@fobianka2131 11 ай бұрын
решила, может кому понадобится, в .topmenu li:hover > .submenu надо прописать position: static; Не знаю правильно ли, но мне помогло))
@wilezar4835
@wilezar4835 Жыл бұрын
пока нет времени посмотреть, но я перемотал, и судя по всему здесь вообще без адаптива. Может было сказано что-нибудь по этому поводу?
@pipajob
@pipajob Жыл бұрын
Очень хорошее видео, жду подобные видео.
@user-nn9qy1yh3s
@user-nn9qy1yh3s 2 ай бұрын
шо за тема редактора ?
@vadymprokopchuk
@vadymprokopchuk 2 ай бұрын
Material
@sartjhon3300
@sartjhon3300 7 ай бұрын
Вроде бы и нормально но.... Что с адаптивом, как это работает на мобильных?
@_s1bga8
@_s1bga8 4 ай бұрын
Меню крутое, но на мобилке оно же не будет работать, поправьте, если я не прав
@user-nn9qy1yh3s
@user-nn9qy1yh3s 2 ай бұрын
на сайті кнопка оплатити працює а задати питання ні )))
@vadymprokopchuk
@vadymprokopchuk Ай бұрын
все працює
@246Dron
@246Dron 7 ай бұрын
Совершенно не практичный пример. Так как нет мобильной версии. Текущая верстка поплывёт в телефоне. Нужна другая разметка. Такая только для компа сгодится, но у нас же 99.9 процентов имеют две версии сайтов: комп и мобилка
@dimondimonov6417
@dimondimonov6417 Жыл бұрын
А что с голосом?
@Blondguy12
@Blondguy12 Жыл бұрын
Наверное заболел
@dimondimonov6417
@dimondimonov6417 Жыл бұрын
@@Blondguy12 Наверно! У нас щас погода неактив
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
простуда наверное, кто его знает)
@yura9067
@yura9067 Жыл бұрын
Перший
@user-lf6fk1fm6r
@user-lf6fk1fm6r 6 ай бұрын
Это урок понять сложно подача конечно не очень,с position в li как это относиться не чего не поймешь.
@user-fd5le5bx9j
@user-fd5le5bx9j Жыл бұрын
Красава, Вадос-Вадос!)))
@Himera1983
@Himera1983 11 ай бұрын
почему display : flex ; не сработал ? в строчку не встали
@user-nv5ec9ch8q
@user-nv5ec9ch8q Жыл бұрын
вадим дай нормальный контент. хватит выпускать чисто хайпожорские выпуски для новичков ради просмотров.
@beatcustom
@beatcustom Жыл бұрын
В классе .topmenu нужно было дать падинг чтобы сработвло
@beatcustom
@beatcustom Жыл бұрын
Внутри этого класса текст выравнивается по паддингу
@beatcustom
@beatcustom Жыл бұрын
4:51
PixelPerfect все что нужно знать
37:58
От 0 до 1
Рет қаралды 16 М.
A pack of chips with a surprise 🤣😍❤️ #demariki
00:14
Demariki
Рет қаралды 35 МЛН
Чай будешь? #чайбудешь
00:14
ПАРОДИИ НА ИЗВЕСТНЫЕ ТРЕКИ
Рет қаралды 2,9 МЛН
Аккордеон на чистом HTML, CSS без Javascript!
13:07
Передача готового проекта заказчику
26:01
Выпадающее меню на CSS + адаптив под тачскрины
32:46
Фрілансер по життю
Рет қаралды 144 М.
6 css свойств которые от тебя скрывают
34:23
CSS псевдоэлементы - before, after, placeholder, selection, marker, file-selector-button, first-line
7:42
Александр Ламков — Friendly Frontend
Рет қаралды 3,7 М.
A pack of chips with a surprise 🤣😍❤️ #demariki
00:14
Demariki
Рет қаралды 35 МЛН