Верстка сайта с нуля, для новичков. Марафон по верстке, день 1
ฝัง
- เผยแพร่เมื่อ 2 ก.พ. 2021
- Марафон по верстке сайта. За 3 дня полностью сверстаем сайт и сделаем адаптив. Объясню все что делаю, и зачем. Отвечу на вопросы.
Тема в VSC - плагин Material Theme
Все исходники, инструкция и информация в телеграм канале.
Ссылка на телеграм канал:
t.me/from0to1ru
Ссылка на телеграм канал с впн:
teleg.one/from0to1ru
Если это не помогает, просто зайдите в телеграм и в поиске введите from0to1ru или марафон по верстке.
Чат верстальщиков:
t.me/chat_from_0_to_1
Как создавался этот дизайн:
• Дизайн сайта
Написать мне в ВК:
vadimprokopchuk
Написать мне в телеграм:
t.me/silver8light
Отзывы о моем авторском курсе по верстке:
topic-104892258_40476405
Подпишитесь на канал, если вам понравилось данное видео:
bit.ly/2IFzwBZ
Вечеринка!
спасибо- нравиться твой стиль работы и мысли
Большое спасибо!!! На позитиве, заряжаешь, красавчик!!!
Денис Борисов в сфере верстки))) Спасибо за позитивный, полезный и доступный контент!
верится с трудом, что реалии среды обитания полные человеческого равнодушия не оттолкнули УЧИТЕЛЯ ( с большой буквы) от учеников. по обучаловой теме Вам нет равных: нет воды.космического благополучия и здоровья всем нам и Вам .
Отличный марафон! Люблю тебя смотреть!)
Красавчик! . жду продолжения истории)))
Круто очень!!! Перебрал кучу видео, остановился на "вечеринках"))) Заходит на Ура!!! Спасибо большое!!!
Марафон огонь, приятно смотреть! Верстаю потихоньку, скоро догоню.
Моё почтение! Здоровья тебе и твоим близким, друг
Благодарю
Это лучшее что есть в бесплатном рунете, на тему верстки для новичков. Свободное общение, доступные материалы! Спасибо! Не останавливайся! Уверен в твоем светлом и богатом будущем!
Спасибо! Как же круто, что я наткнулся на этот канал. Изучение верстки становится веселым и занимательным. Респект
Такие же мысли)
как всегда на высоте - спасииибо
всем привет, отличный марафон, лайк однозначно!
класна та доступна подача матеріалу, дякую)
Очень хорошо объясняешь. Мне понравилось. Подписался
Очень подробные понятные объяснения! Дякую!
Спасибо большое! Ты классный)
Классная вечеринка!))) Автор молодец!
Ты делаешь доброе дело🙏
Спасибо большое за марафон! Скажите пожалуйста, при подключении normalize.css нужно писать для тэга свойство box-sizing: border-box?
Просто кайфуем 😂👍
Топчик, отличный контент
Девачки, я снова плачу, за что мне такой бесплатный контент? У меня день рождения?
ВАДИМ, от души...
Твои уроки очень крутые) Успехов тебе в твоих планах!
Братан спасибо большой :)
спасиба что есть такие люди каторые обьясняют и все панятно учусь по вашем видео и хачу в дальнейшим устроится на работу по верстке как устроюсь на работу
буду делать данаты вам добро адуши душевно в душу с уважением😃
Подписка и лайк .Буду ждать новые стримы по верстке.
Видео супер. Вадим, тебе большое спасибо.!!!! Скажи, как называется тема для VSCode?
Много внимания мелочам, это мега круто!!!
Супер! Щиро дякую!
шикарно!
А есть где нибудь код? Не работает слик, не могу найти ошибку 🤒
контейнер родителем быть не может, у него проблемы в жизни
Орууууу ахахахахаха
Спасибо большое!!! Круто!!! Респект!!!
если я дам свой телеграм, то можешь прислать етот сайт?
Давай
@@TaimasovK @John_1565
1:28:20 когда спрашивают как продвигаются у тебя дела в изучении верстки
Реально он круто обоснует
Это...Просто...О%#енно
Малый конечно молочага!)) jQuery в топку))
где можно сравнить твой код с собственным, например найти ошибки в коде
Привет, спасибо за материал. А адаптив будет?
классная вечеринка получилась
Клаааас!!!
спасибо!
на заметку! 2:40:40 для .top__item{ вместо всего ниже написанного
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
text-align: center;
можно указать для .top__item img{
margin: 0px auto 10px;
результат тот же.
буду смотреть дальше оба варианта, как поведут себя при адаптиве. Спасибо!
спасибо!!
Спасибо за марофон! Только где макет? Ссылка на чат верстальщиков!
Вадим, хочу записаться на Ваш курс, но ссылка на телеграм ведёт на скачивание приложения, а в контакте, не отвечаете. Как с Вами связаться?
Krasavchik
почему вы не делали section 100vh, секция с иконками же не вмещается по высоте первого экрана
какие плагины у тебя для css, заметь пожалуйста))
СПАСИБО ! Дядя Вадим !
п.с. не сердись на меня за предыдущий коммент , удачи !
Подскажите, как с позиционировать placeholder
slider 2:01:30
кнопка 1:52:00
css 30:33
html 9:39
Как всегда вместо сериальчика стримчанский с Вадосом)))))
доброго дня, не подключается слайдер, до момента подключения все работало корректно
ты мой бро))))))))))
Почему в хеадере просто по центру все расставил, если в фигме там по px не все по центру стоит? И расстояние между меню логотипом и телефоном тоже не указали, а просто выставили по центру, так можно делать?
Здравствуйте, можно ссылку на фигму с этим дизайном?
Чувак, как адаптировать свёрстанный сайт под мобильное устройство?
а где исходники? в телеграмме не вижу, чтобы были
Как обойти фичу, когда transform: scale блюрит изображение, в макете был текст, но бывает кнопки и с фото?
зы Постараюсь это задать в чате, если тут не увидите, надеюсь эти вопросы не только мне интересны)
Нужно смотреть на код. Но, как вариант, добавить элементу, который НЕ нужно блюрить обёртку (.wrapper, или просто закинуть в тэг div), и в CSS застилизовать её прямопротивоположно. То есть задать отрицательный transform: scale, либо scale по умолчанию.
Хедером называется все что попадает на первый экран без прокрутки (нав бар, тайтл, текст, кнопка и ТД), то что вы называете хедером - называется нав бар
100 мильёнов лайков!!! Спасибо БОЛЬШОЕ!!!!
Лукашенко !
сколько вёрстка такого макета стоит в россии?у нас примерно 200-300 баксов.
Есть видео, где макет про Турагенство, где большое количество картинок, которые заходят за пределы контейнера?
все что было на марафонах все есть на канале
@@vadymprokopchuk Понял спасибо, буду искать. Просто наверное знаете, когда кучу картинок, которые расположены на тексте в качестве украшения сайта.
2:45:45 такая жиза))
Добрый день..Простите, если не буду оригинален.
Где брать материалы к этому уроку? Имею ввиду макет
првиет, телеграм в описании, переходите и там листаете до этого проекта, там будет макет
@@vadymprokopchuk Благодарю.
что за тема в vscode?
подскажите пожалуйста есть ли макет в фигма?
Зачем использовать line-height, если всего одна строка текста?
заказчик может в дальнейшем добавлять контент в макет на своё усмотрение. так что другие строки вполне допустимо могут появиться
А что это за программа в начале ? где сам сайт
я с тобой владос!!!!!!!!!!!!
цеэуропейцы без антисоветчины не существуют
дайте ссылку на макет
Круто конечно , но если смотреть в 2х, много отвлекаешься на вопросы, хотя сам говоришь что в конце стрима ответишь
Круто, конечно, что ты у нас великий всезнайка, но не все такие, как ты. В чате много новичков, которые задают ему вопросы, возникающие по пути вёрстки. А запись смотрит не меньшее количество новичков, у которых могут быть одинаковые вопросы, которые будут озвучены Вадимом сразу же.
Так что закрой пасть и не кипишуй)
а че в одном марафоне бокс-сайзинг только для звездочки, в другом еще для афтер и бифор, а здесь вообще для хтмл, а для бифор и афтер отдельно инхерит? ¿🙈
а где макет?
не могу в телеге найти этот макет!
а есть ссылка где можно скачать этот дизайн в фигме? или кто-то может скинуть, пожалуйста)
в телеге
доброго дня, підкажіть датупроведення марафону в телеграмі..не можу знайти макет
сам спитав..сам знайшов 3 лютого 2021 року
Вот блин. фигма уже не работает на виндоус 7 (((
а онлайн версия очень сильно тормозит.
что же делать. поддержка виндоус 7 прекращена, и я теперь не смогу скачать обновление KB2533623 а без него фигму не запустить на семерке (((
попробуй установить виртуальную машину, а на неё десятку а там фигму
Осталось сделать этот сайт и для старичков
я сам не смог сделать, чет жестко новые свойства transform: scale(1.25); я специально не стал сам делать думаю щас посмотрю а там че будет, как хорошо что я не стал сам делать я бы каждый шриф прибавлял и проклял бы этот hover. а тут просто scale черкануть нужно
Как убрать маркеры в списке?...
когда вторая часть
Вышла уже давным давно
@@vadymprokopchukсори не видел
@@vadymprokopchuk а так канал у вас топ
еще с 2019 года подписан
как ты только успел в 3 дня уложиться. ты наверное очень крутой?
ахахахаха, вектор вектор вектор и ещё раз вектор говорят мне о том, никогда не догадаетесь..... что это векторXDDDDDDDDDDDDDDDDDDD 47:17
В когось слайдер зїжав при підключені slick????
Як включити в фігмі ці червоні рамки що на 8:11 ?
Shift+R
Shift + R
Де взяти макет дизайну?
телеграм в описі, дальше в файлах
Ты Бурят?
У меня не выровнялось.
Блин, пропустил, дайте макет пожалуйста.
Зайди в его телеграм группу ,вроде в описании под видео должно быть
И прогортай до момента где начинается марафон по этой вёрстке
Нету макета из видео.
в телеге посто 3 февраля. там макет
@@goodcthulhu250 Спасибо.
2:39:30
Я что не пойму где лого... я уже умнее чем ты. Очень смешно))))))))))))))
1:32:00
2:30
box sizing border box что это? и как его использовать - th-cam.com/video/IH_V0duSGLo/w-d-xo.html
кто диз поставил? обоснуй