Адаптивная вёрстка лендинга. Как сделать верстку сайта. Правильная верстка сайта. Респонсив.

[@FreelancerLifeStyle]

Ценю твой ЛАЙК и КОММЕНТ! Получить доступ к плюшкам + поддержать канал: www.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/

[@lera6580]

Как только получу деньги за выполненный проект - обязательно поддержу канал. Спасибо за качественный и бесплатный материал. Очень хорошо рассказываете.

[@waden666]

Женя, привет! Спасибо за вестку шаблона, учусь верстать по ней) Переписал твой хак с бэкграундом для img по классу ibgs на чистый js без jquery, может пригодится кому-то: (function(){ let ibgs = document.getElementsByClassName('ibg'); if(ibgs){ for (let item of ibgs) { let imgSrc = item.children[0].attributes[0].value; item.style = `background-image: url("${imgSrc}");`; } } }());

[@NemovNemov]

Здравствуй)Спасибо за канал и подачу - один из немногих, кто может преподавать сложные(для начинающего) вещи, доступно и не нудно!)

[@lolopepe4933]

ссылка на макет не работает

[@bake5448]

как вы копируете классы html в scss?Можете подробный гайд снять настройки кода,или же написать мне в ответ если не сложно.Спасибо большое заранее

[@lera6580]

Сверстала макет! Все супер! Спасибо огромное! за один только ibg можно залайкать =) в остальном, делала все как на видео, за исключением деталей: 1. сборка проекта методом gulp 2. цветовая палитра на переменных 3. размер шрифтов, междустрочные интервалы миксином в rem переводила 4. каждый уникальный блок выводила отдельным .scss файлом. мне так удобнее, чем все почти в одном файле стилей. 5. скрипты завернула в функции (иначе консоль выдавала ошибку) пы.сы. после поддержки канала получила много "ништяков" =)) очень интересные коллекции у Вас. еще не все обработала. От сердца Вам лайк! Канал супер! Сверстаю все Ваши макеты с удовольствием. Подача материала и голос тоже класс. В общем ОГРОМНЫЙ ЛАЙК и Благодарность!

[@FreelancerLifeStyle]

Супер! Молодец! Спасибо!

[@yurimonakhov9642]

вместо .ibg можно выставить для img стиль object-fit: cover, не забыв указать внешему контейнеру positionL: relative, а img - absolute+раскидать на всю ширину и высоту и не нужно никаких jquery и скриптов + заказчик легко меняет, как обычно, картинку

[@FreelancerLifeStyle]

@@yurimonakhov9642 вот kzbin.info/www/bejne/pIXXppx4jbCjbpo Js помогает со старыми браузерами типа IE11

[@yurimonakhov9642]

@@FreelancerLifeStyle да, к сожалению, IE всегда подкладывал свинью верстальщикам )) спасибо за уроки, отлично объясняешь!

[@oleg_andrianov]

привет. у тебя получилось использовать ibg?

[@ЖекаКрылов-о5з]

Дошёл до урока адаптивной вёрстки, легкотня, открываю домашку, и как будто никогда не учил вёрстку)) надо для неё ещё 10 уроков сделать)

[@gpt_v22]

4:15 - fullscreen block 32:20 - generation block 39:30 - brands sections 1:09:04 - slider 1:16:15 - shop block 1:38:38 - email form 1:47:55 - footer

[@Rostislav.086]

На ютубе полно всяких обучающих материалов которые как поверхностно так и более подробно разбирают темы. Но ты делаешь это максимально понятно и круто! Вся инфа воспринимается и усваивается на максималках! Это пушка!🔥 однозначно топовый контент в этой сфере. Жду с нетерпением уроков по JS

[@FreelancerLifeStyle]

Спасибо большое! JS будет!

[@ЯнаМакельська]

Это магия!!!!!!!!Просто нет слов,одни восхищения и благодарность!!! Так и хочется сказать,что Вы волшебник)))

[@ДаниярДосыбаев-г1о]

По моему мнению, это - " The best " видео по адаптивной вёрстке!!!) Спасибо Жека, так и мути!

[@FreelancerLifeStyle]

Спасибо!

[@ИванБ-ы5я]

Жека, смотрю и поражаюсь как быстро и четко ты все делаешь, представляю, если бы не объяснял и работал со всеми мониторами, то было бы еще быстрей. В общем еще раз спасибо за твои видео, ты отличный пример для подражания!

[@FreelancerLifeStyle]

Спасибо!

[@nikola-san]

Очень качественная подача информации. Дикция, моушен, контент - все на уровне. Спасибо за твой труд!!

[@FreelancerLifeStyle]

Спасибо, стараюсь!

[@МихаилРазуваев-ь6л]

Отличный мини-марафон: всё быстро, чётко, без "воды"! Респектос!

[@FreelancerLifeStyle]

Спасибо!

[@pavelkiselyov6418]

Видео офигенное, всё по полочкам, некоторые вещи не знал, но запомнил, , смотреть было приятно. Не заметил даже как пролетело 2 часа. Ты реально умеешь уменьшить код, что мне ещё больше приятно смотреть. Сам тоже весь дизайн делаю с нуля и не пользуюсь никакими бутстрапами, библиотека или фрейворками, только jquery и свой js. Подписался.

[@FreelancerLifeStyle]

Спасибо! Я рад что полезно!

[@sanya18888]

Может я не прав ребятки, ну по моему это сложный макет для самостоятельной домашки , Женя использует тут кучу непонятных заготовок , снипитов джава скрипт и JQueriи т.д Хотя это еще не пройденный материал . Для меня это очень тяжело для усвоения , думаю нужно будет вернутся к этому макету намного позже. Автору конечно же огромная благодарность за работу.

[@VitaliyTixk]

Так и сделал. Изучил другие темы, включая разные адаптивы картинок, меню, даже сетку GRID начал изучать и только после этого вернулся заканчивать и усваивать этот макет. После этого намного легче на него смотреть и делать

[@programming4781]

Ух, посмотрел почти все твои видео, и уже чувствую, что очень прокачался, но все еще впереди!

[@FreelancerLifeStyle]

Я рад! Впереди еще много всего интересного!

[@Denis-t2m]

Жека, спасибо большое! Нашел много ответов на свои вопросы, еще учиться и учиться, чтобы понять всю ценность твоих уроков. Желаю тебе таких же "годных" подписчиков, как твой контент!=))

[@FreelancerLifeStyle]

Спасибо большое! 👍🤟

[@maksymsemehen6063]

Ты лучший учитель в моей жизни!

[@FreelancerLifeStyle]

Хех, спасибо! 🤟

[@chashenkov]

Зашел на Ютуб и сразу увидел очень актуальное для меня видео. За это лайк. Скоро к кардиологу поеду, поэтому посмотрю немного позже. Огромное спасибо за такой контент!

[@FreelancerLifeStyle]

Пожалуйста!

[@БАГВечныйэпик]

СУПЕР БЭСТ. Очень полезная информация. Долго искал и, наконец-то, нашел. Рекомендую посмотреть ВСЕМ

[@ilyaprotsenko1023]

Огромная благодарность за твой труд: познавательно, информативно, неординарно! Словом, потрясающе!

[@SADOVYT]

Самый лучший канал о верстке и впринципе о коде, очень много ты помог, спасибо! Лайки везде ставлю :) Продолжай!

[@FreelancerLifeStyle]

Я рад!

[@SADOVYT]

@@FreelancerLifeStyle еще хотел спросить, если ли у тебя вышее образование (и какое, если есть). Так же вопрос, есть ли смысл в вышке в 2020( я учу фронт )

[@ВолодимирПаньківський]

Жека, огромное спасибо за всё, что ты делаешь. Вся выкладка материала последовательна и понятна. Ссылки на предыдущий материал и дополнительные разъяснения вообще переоценить трудно. С таким багажом информации остаётся только практиковаться. Чем и начинаю заниматься снова, поскольку на некоторое время выпадал из процесса. Ещё раз огромное спасибо.

[@FreelancerLifeStyle]

Пожалуйста! Я очень рад что полезно!

[@annamets]

Большое спасибо! Четыре дня смотрела и повторяла за видео, почти всё получилось. Следующее по плану видео про слайдер.

[@FreelancerLifeStyle]

Супер! Молодец!

[@WanKy182]

Спасибо за урок, очень информативно, много полезной информации для себя почерпнул. Интересные приёмы с процентным паддингом для высоты блоков

[@FreelancerLifeStyle]

Пожалуйста! Рад что полезно!

[@lihonespit]

Ще не дивився, але без сумнівів лайк.

[@FreelancerLifeStyle]

Дякую! 🤘

[@ilyanizamov]

Спасибо за опыт! Очередное видео, после которого пошел переписывать свой макет )

[@FreelancerLifeStyle]

Пожалуйста!

[@ДанилБуткин]

Ребятки ,все ставим жирный королевский лайк Жека лучший , получилось как всегда огонь !!!!

[@FreelancerLifeStyle]

Спасибос!

[@ЖуранськийЄвгеній]

Я полгода учу верстку по урокам Евгения. Я в шоке, я вообще не ожидал таких результатов от себя. Открыл домашку и сверстал за 5 часов, не за 2 конечно)) Мало таких людей, которые дадут такую информацию, да еще и макет бесплатно. Жека, спасибо огромное за все старания!

[@bake5448]

как он копирует классы html в scss,еще и с комментарием?как забиндить?поможете настроить?Спасибо большое заранее

[@ЖуранськийЄвгеній]

@@bake5448 На канале есть видео про установку sublime text 3. Там показывается как установить плагины, в том числе и плагин tag, с помощью котрого переносятся классы

[@АртёмРуа]

пол года учишь верстку и сверстал за 5 часов??)))

[@ЖуранськийЄвгеній]

@@АртёмРуа Да, и что?

[@АртёмРуа]

@@ЖуранськийЄвгеній 1.5 часа 2,5 месяца обучения)

[@maybelater9915]

Бесконечная благодарность за урок!

[@nikitakashirskiy7758]

Спасибо за твой контент. Таким новичкам как я всегда не хватает практики, и сложно делать первые шаги после изучения теории. Удачи тебе)

[@FreelancerLifeStyle]

Спасибо!

[@ЕрасылШаймуратов-щ5в]

Как учпехи

[@НурсултанТашанов-б8г]

Оооо верстка, большое спасибо за ваш труд!!! Ещё видео не успел посмотреть но чувствую это будет нечто!!

[@FreelancerLifeStyle]

Спасибо большое! 🤟

[@mahonyaKodit]

Женя! Спасибо тебе, что делишься своим опытом! Обожаю твой канал - он лучший среди всего IT-контента 🧡

[@bake5448]

как он копирует классы html в scss,еще и с комментарием?как забиндить?поможете настроить?Спасибо большое заранее

[@longDaay]

@@bake5448 плагин ECSSTRACTOR

[@yuriishevchuk2977]

Женя, вы лучший! Спасибо Вам за полезные видео! С вёрсткой справился за три дня, всё получилось!

[@Rumpe1stiltskin]

Без твоих заготовочных файлов очень сложно повторять)

[@andreypolkeyev6595]

Очень крутая вещь ibg. Огромное спасибо за то что делишься своими наработками это очень ценно для начинающих.

[@brodyagaPATY]

Сегодня посмотрю!!! Жирный лайк старания и видосы👍👍👍👍👍

[@FreelancerLifeStyle]

Спасибо! 👍👍

[@СергейК-б6н]

Жека реально божий человек!

[@artyomvoytenko1237]

Много полезных фишек можно подчеркнуть. Спасибо за видос) Будем продолжать развиваться)

[@FreelancerLifeStyle]

Спасибо! Я рад!

[@Hrusst]

Очень крутой и профи контент... Спасибо за классные уроки , смотрю с удовольствием... Продолжай в том же духе!

[@FreelancerLifeStyle]

Спасибо продолжаю!

[@ukraine_son]

Евгений, спасибо за урок. Очень понравилась технология отзывчивости из padding в процентах. Да и не только)

[@FreelancerLifeStyle]

Пожалуйста!

[@sergiychernyshov1195]

Спасибо огромное за то что делитесь таким ценным опытом и знаниями!!! По поводу класса ibg могу предложить более корректное написание функции на чистом js с использованием асинхронности и промиса. Просто цикл For не рекомендуется использовать! async function ibg(){ const images = document.querySelectorAll(".ibg"); if (images.length > 0) { await Promise.all( await Object.keys(images).map(async (i) => { if(images[i].querySelector('img')){ images[i].style.backgroundImage = `url(${images[i].querySelector('img').getAttribute('src')})`; } }) ) } } ibg().then(() => { console.log('images BG added correctly') }).catch(err => { console.log('Error: ', err) throw err; })

[@zm1468]

чел, ты спас меня, 15-ю минуту думаю над этим вопросом, оказывается в этом и была проблема, спасибо!

[@nik2991]

Поздравляю с 20к на канале 🔥 Подарок к новому году 😀🎄

[@FreelancerLifeStyle]

Спасибо!

[@СветланаТюкавина-х2б]

Хорошая практика, спасибо за объяснение.

[@FreelancerLifeStyle]

Пожалуйста!

[@sv_smile]

Возможно для первого адаптивного сайта - как пример слишком сложно (сейчас для меня). Но - интересен такой уровень. Спасибо за ваше время и знания! Пока иду на предыдущие)..

[@bake5448]

как он копирует классы html в scss,еще и с комментарием?как забиндить?поможете настроить?Спасибо большое заранее

[@vadimsib3378]

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

[@FreelancerLifeStyle]

Ок, подумаю над этим

[@ivanborsuk4117]

Як завжди на висоті=) дякую за крутий урок=)

[@guyinternet2018]

Спасибо, что Вы есть! Успехов!

[@FreelancerLifeStyle]

Пожалуйста!

[@m_mariya_mari]

Спасибо за такой шикарный урок, за вашу виртуозную верстку!👏

[@konstantino7016]

Круть!!! Отдельное спасибо за ссылки на полезные полезности

[@АртемКа-в3к8й]

спасибо за урок, показал в очередной раз силу БЭМа))

[@FreelancerLifeStyle]

Пожалуйста!

[@ВиталийМирошниченко-с9я]

лайк если уже третий день сидишь на этом макете!!!!!!!!!!!!

[@alexsilan4516]

Такой формат я думаю даже лучше, чем формат стрима тк на стриме не выходит походу объяснять определенные вещи. И да (как ты упомянул) в некототых видео достаточно много DIVатоза так что хотелось увидеть побольше БЭМа и семантики. И конечно спасибо!

[@FreelancerLifeStyle]

Пожалуйста! Тут и БЭМ и семантика) По семантике будет еще отдельный урок!

[@alexsilan4516]

@@FreelancerLifeStyle безусловно здесь семантика есть (даже если сравнивать с предыдущими видео) но все-таки бывает что-то проскакивает например текст в div (p - возможно был бы уместнее) ещё бы возможно лучше использовать темную тему chome тк у вас темная тема редактора (в самом видеоролике будет меньше переходов черный-белый)

[@FreelancerLifeStyle]

@@alexsilan4516, я люблю вкладывать p без классов, но это такое, привычка. Возможно местами и правда более уместно. Вот тему поменяю, спасибо!

[@PavloShkura]

Дякую Вам за цю велику працю!

[@FreelancerLifeStyle]

Будь ласка! 👍🤟

[@haaslathe105]

Самый лучший учитель

[@FreelancerLifeStyle]

Спасибо!

[@JUVE127]

Спасибо за мастер-класс. Пробовал повторить, в итоге получилось с навигацией и первым блоком брендов, еще 2 блока брендов делать не стал так как они вроде по аналогии делаются. Подвал вроде тоже не сложный, осталось только слайдер повторить попробовать. шел по порядку обучающих видео и на этом стриме сложность выросла на порядок. в скриптах вообще ничего не понял просто повторил с экрана. в css в общем почти все понимаю, но в громоздком коде начинаю местами путаться, так как вы его пишете почти со скоростью света) в общем спасибо, начинаю по вашим видео вникать немного но путь еще длинный.

[@FreelancerLifeStyle]

Главное не останавливаться!

[@ЕрасылШаймуратов-щ5в]

Привет, как успехи

[@KindCat21]

Отличное видео! Спасибо, Жека!

[@FreelancerLifeStyle]

Пожалуйста!

[@aibekk2434]

Спасибо за уроки! Отличная подача!

[@ЮраОгороднік-р4ъ]

ахахххх.... - за пару минут мы все зделали.... Я вже тиждень роблю))))

[@lera6580]

хотела за день сверстать. так как не новичок, но... =) я на 18 минуте, а уже вечер)) все супер. Разбираю по ходу дела логику, а не повторяю как хомячок за Автором.

[@FreelancerLifeStyle]

Молодец! Спешка не к чему!

[@sultan4946]

Посмотрел на upwork вакансии на верстку там требование делать по 7-8 штук таких в день ну я в шоке немного :D Я сам больше по бэкенду но фронт тоже интересует.

[@АннШ]

Спасибо за отличную практику! Получилось почти все повторить за вами (потратила несколько дней), но я не использовала scss, мне с ним пока сложно. В процессе верстки пересмотрела видео про БЭМ, слайдер, бургер меню Я работаю в VS code, нашла для него плагин для копирования классов из HTML в CSS eCSStractor for VSCode (аналог вашему cscTractor для Sublime), до этого не знала, что так можно делать. Для новичков покажите, пожалуйста, как сохранять графику из PS, т.к. программой Avocode беcплатно можно пользоваться только 14 дней(. Ну и вообще нужно уметь это делать из разных программ). Я верстала из фотошопа. Было интересно про баг IE c footer-ом, оказалось все просто решается перемещением его в блок выше. Еще раз спасибо!

[@FreelancerLifeStyle]

Пожалуйста! Тут видос по настройке VS Code kzbin.info/www/bejne/pKmmfYuDd9Fnm5Y

[@progenen5631]

Спасибо за плагин, пол дня искал аналоги на VS!

[@tirrus1778]

Напиши мне в телегу @tirrus, расскажу про Avocode.

[@ДмитрийРоманов-ы2ь9г]

шикарно рассказал, шикарно сверстал!по скорости-мега!!!

[@FreelancerLifeStyle]

Спасибо! 👍🤟

[@nargizaergasheva6527]

Супер Жека, очень понравилось

[@mambasacaremamba2671]

Быстро растешь скоро 20тыс будущих верстальщиков будет))))

[@FreelancerLifeStyle]

Спасибо, стараюсь)

[@technic_and_programming]

Этот блогер достоен большего, чем другие блогеры которые снимают всякую чепуху, и таким образом попадают в тренд ютуба. Жесть...

[@bestviners3383]

Жека как всегда Круто И ПРОФЕССИОНАЛЬНО !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

[@FreelancerLifeStyle]

Спасибо!

[@mambasacaremamba2671]

Оу.. крутяк подъехал свежачек, спасибо

[@FreelancerLifeStyle]

Пожалуйста! 👍

[@niceman5890]

Спасибо тебе без тебя я бы может и не занимался вёрсткой!

[@bake5448]

как он копирует классы html в scss,еще и с комментарием?как забиндить?поможете настроить?Спасибо большое заранее

[@niceman5890]

@@bake5448 посмотри настройку vs code от него там он рассказывал, как биндить

[@niceman5890]

@@bake5448 это плагин

[@bigthinks2290]

Очень классный выпуск!👍🏽👍🏽👍🏽

[@FreelancerLifeStyle]

Я рад!

[@Ada.m.Dementev.a]

Спасибо за стрим, будем пробовать =)

[@АртёмРуа]

попробовал?

[@andyrey840]

Первый раз вижу подгонку картинок с помощью процентного падинга. Я обычно задаю блоку ширину и высоту , а картинке все 100% и object-fit: cover; , но с падингами выглядит легче. Нужно будет попробовать )

[@FreelancerLifeStyle]

Ага, плюс более кроссбраузерно!

[@VitaliiMaevskii]

Спасибо за урок! Отличный пример) И теперь у меня точно все получится.

[@FreelancerLifeStyle]

Пожалуйста!

[@taashev]

Так много монипуляций что бы сделать background через img ф фул скрине. Это просто на тот момент была плохая поддержка свойств object-fit? или я чего то не понимаю. Я к тому что если главному блоку задать relative и 100vh и в нем создать дочерний элемент main-bg с вложенным img и этот main-bg абсолютно позиционировать на весь главный экран а картинке задать object-fit то результат тот же вроде бы. Я только учусь не нападайте) Дайте просто фидбек) я просто пытаюсь разобраться. Просто у меня этот вариант так же работает во всех браузерах. Вот пример о чем я говорю и более наглядно в codePen (Там я заменил картинку что бы подгружалась с интернета) Пример: main-screen { max-width: 100%; height: 100vh; position: relative; } .main-screen main-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; } .main-screen main-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center; } codepen.io/Monkey-Archi/pen/OJjyxKG

[@Semen_aqw]

99vh) иначе насколько я понял по моему нельзя будет прокрутить вниз) P.s то что я написал неверно)

[@Semen_aqw]

Спасибо большое))) все рабоает , сам верстаю на 2 чертогах но ничего не заработало с подключением ibg какое-то заклинание на нем стоит)

[@vladimirstavinchuk7786]

Не срабатывает этот ibg. Из-за этого всё видео теряет ценность. Картинка исчезает, но класс не добавляется. В адаптивных картинках про ibg только вскользь. Не срабатывает, скрипт подключен. Правда я в убунту и визуалкоде делаю, через лайв сервер. Похоже тут console.error('Upgrade your browser. This Browser is NOT supported WebSocket for Live-Reloading.'); загвоздка. Сервак поднимать или есть решение?

[@Artem-bt1cx]

крутая фича с ibg, спасибо, возьмём на вооружение)

[@FreelancerLifeStyle]

Пожалуйста!

[@nulionok]

@@FreelancerLifeStyle А где про неё можно подробнее посмотреть? Спасибо заранее за ответ!

[@FreelancerLifeStyle]

@@nulionok kzbin.info/www/bejne/nqCmkJmgmrFphpY

[@oleg_andrianov]

привет. ты разобрался с ibg? у меня ничего не работает.

[@Сергей-ю8и1х]

Очень круто! Спасибо большое!

[@vadymmmkoo]

Жека любит прикольнуться) Я 2 часа разбирался, почему у меня переменную с Lato не переваривает. Оказалось, нужно сначала её обьявить, а потом вызывать, нужно быть внимательным при её использовании, особенно когда импортируються файлы туда/сюда. В итоге строку с $ нужно было поставить выше чем @import "null.scss"

[@ВиталийМирошниченко-с9я]

я минут 5 попробовал, и сделал фиксированные значения, спсибо за инфу, а сейчас 2ой час колдую на времени: 1.14 и уменя никак не получается .slider__body уже по 5 раз проверил fайлы js scss kit также делаю через препрос ,думаю видео как закончу буду смотреть туториал по слайдерам

[@MestagaN]

Отличное видео! Вот только я как новичёк просто утонул в этой куче файлов, так и не поняв что куда и как... Как подключить и т.д. По итогу логотип и меню не отображаются. :(

[@maik1510]

Берём чаёку и присаживаемся смотреть :)

[@FreelancerLifeStyle]

И печеньки👍

[@ДианаПынзарь-ч6й]

Оромное спасибо за отличный контент!

[@FreelancerLifeStyle]

первое что приходит в голову это объявление по селектору тега и класса - a.имякласса { color: red;}

[@val-tin8663]

Будем практиковаться, спасибо.

[@djburger7652]

20:07 не особо понял что это за "миксин" - "tr" и как логотип выровнялся по центру??

[@FreelancerLifeStyle]

Миксин подключает свойство transform. Будет подробный урок по нему

[@ДмитрийКалайтанов-и9п]

@@FreelancerLifeStyle У меня transform не срабатывает, нужно наверное еще что-то написать типа translate?

[@antyvlog9343]

Здравствуйте, подскажите на каких видео было описано подробно о "ibg" и о подключении jquery, по данному видео с первых минут не понятно что откуда подключил и как это настроено. background не нужен "ok" (может другу картинку загрузят), а потом " подключили background через jquery"... (не понял), очень хочу понять, пожалуйста подскажите где это... ?

[@front-end14]

Крутяк, спасибо Жека 👍

[@FreelancerLifeStyle]

Пожалуйста!

[@mudlik]

Будет какое-то видео об методе ibg? (если есть киньте ссылку) ничего не понимаю что как и куда(

[@FreelancerLifeStyle]

kzbin.info/www/bejne/pIXXppx4jbCjbpo

[@letsplay6285]

Оооооо, друуууг лайк мой равен 1000!

[@FreelancerLifeStyle]

Спасибо! 👍👍👍

[@ZmicerVilenski]

На 13й минуте все стало. Из-за IBG, на кой это нужно было сунуть сюда? Если урок для профи, то на какой им такой урок? если для нубов, то как разобраться с этим ibg? В видосе посчелкал между экранами, вот мол ibg я придумал. Хитрость будь здоров. Там всего лишь 15 скриптов привинтил и 50 доп файлов в проекте. По умолчанию, всем же ясно :) Не ужели просто код с bg-image показать нельзя было? В итоге потраченый час в пустую. Ни сайта, ни понимания.

[@skmail8884]

+ посмотрел и ничего не понял

[@olehmarchuk5106]

А я вот не понимаю для чего использовать position absolute, зачем мне вырывать лого из структуры?

[@mioanna-store]

Просто пропишите в стилях к блоку с картинкой background: url(...) center (center/cover) no-repeat; и все, тот же самый эффект +- будет. В видео просто показан вариант для удобства пользования заказчика

[@Semen_aqw]

@@talivel118 как сделать чтобы скрип работал ??? у меня нет изображения и хз почему скрип не работает

[@KrazyHell]

ты подключил его к html файлу?

[@DashaG182]

Какая красотень вышла! Мастерство!)) можно вопрос - почему Вы не используете один параметр padding или margin , например, bottom, чтобы не писать в одну строку еще 3 нуля?)

[@AndriiKostyra]

Это шедевррр! :D

[@FreelancerLifeStyle]

Спасибо!

[@yurlis1973]

В блоке shop в четвертой колонке снизу белая полоска. Она получается из-за неточного указания 50%. Т.к во второй и третьей колонке 200.5% то там надо указать (200.5 - 100)/2 = 50.25% и будет все точно и красиво ;)

[@игорьшапранов]

Жека ТЫ Гений с IBG

[@FreelancerLifeStyle]

Спасибо!

[@СергейТемников-м8с]

Привет Жека!, Ты опять на высоте, супер!!! Не могу найти ролик про препроцессор KiT, ты его не делал?

[@FreelancerLifeStyle]

Спасибо! Отдельного ролика нет. Есть информация в видео про Prepros kzbin.info/www/bejne/eKKyZoOgZ5uio5o

[@генагрек-й8ь]

Женя спасибо все круто,респект.

[@РомаБоренко-г2э]

однозначно топ, конечно я навечек мало че понял но обязательно пересмотрю еще раз когда опыта наберусь

[@FreelancerLifeStyle]

Спасибо!

[@Евгений-д3ц6ц]

Вот тут всё хвалебные комменты только пишут, я против ничего конечно не имею и полностью с ними согласен, инфа хорошая, полезная и доходчивая. Но выплесну немного своей попа-боли, и эмоций нуба-новичка: Люди, неужели вы настолько быстро всё схватываете, и молниеносно понимаете, что смотрите его видосы за тарелкой пельмешей, как развлекуху?!) Честное слово, у меня на 2х часовой видос ушло 3 дня, я просто стараюсь понять и повторить. И при этом нередко возникают ситуации, когда вроде повторял слово в слово, у меня не работает, у него всё норм..да, в итоге находишь ошибку (обычно это забытая где-то точка или вписанный не туда класс) но это сука спустя час поиска и разбирательств. И то, некоторые ошибки так и не смог решить, своими костылями залеплял. Люди, не поленитесь напишите коммент с описанием своего положения дел, а то складывается впечатление что все вкуривают материал моментально, и уже через месяц лобают сайты и живут на фрилансе.

[@FreelancerLifeStyle]

Это мастер-класс. Его смотрят те которые уже знают технологии чтобы набраться опыта. Для тех кто еще не очень владеет теорией есть бесплатный курс на канале.

[@pusika3]

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

[@СергейПтиц-з1ф]

здесь 80% тех,кто пишут комент сами ничего не пишут,поэтому большинство хвалебных коментов,еще 10%,это те,кто уже умеют верстать и еще 10%,те кто только учаться и посто аxy3вают от того,что ничего из миксинов,сниппетов не объясняется и ничего не понятно. Если почитаешь коменты,то поймешь о чем я

[@deeco8289]

Если не появляется стрелка под .brands__content,то просто добавьте z-index: 1; &__content { padding: 70px 65px 55px 65px; position: relative; &::after{ content:''; position: absolute; z-index: 1; bottom: -10px; left: 50%; margin: 0 0 0 -10px; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #ffffff; } }

[@localhost_9999]

Спасибо за урок. Много крутых и уникальных фишек показываешь ) Жень, а а поделишься как-нибудь своими сниппетами для CSS в Sublime, пожалуйста?) Наподобие md1500, pos-a и других.

[@FreelancerLifeStyle]

Все есть на патреоне

[@localhost_9999]

@@FreelancerLifeStyle Что-то я там не нашел... Твой fls_start_template скачал, учусь по нему.

[@oraoraoraora3567]

сделал фулскриновую картинку через background-image, в итоге она у меня отображается со сдвигом в право(велосипед не по середине экрана), как пофиксить?

[@nodirkarimov428]

А вы сколько вёрстку практиковали? Я практикую уже неделю-две, и всё ещё не могу норм код на html написать.

[@newfeel.305]

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

[@bake5448]

как он копирует классы html в scss,еще и с комментарием?как забиндить?поможете настроить?Спасибо большое заранее

[@irynaloushkina2284]

самый сочный во всех смыслах, по моему мнению, макет. Повторила, но не все получилось. В секции brands маленькие фото не растягиваются на всю ширину (((( буду искать ошибку. Спасибо большое

[@FreelancerLifeStyle]

Пожалуйста! Все получится!

[@railroadman2k]

Евгений сниппеты на css все самостоятельно сделали или утановили готовые?

[@FreelancerLifeStyle]

Сделал под себя

[@KuAntuan]

5:46 Смотрю курс по верстке. Столкнулся с тем, что в PrePros уже нет KIT, да и судя по одному из стримов ты уже не пользуешься им. Стоит ли тогда использовать вообще PrePros? Пропускать этот урок и сразу ставить Gulp?