Верстка сайта с нуля, для новичков. Марафон по верстке, день 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
верится с трудом, что реалии среды обитания полные человеческого равнодушия не оттолкнули УЧИТЕЛЯ ( с большой буквы) от учеников. по обучаловой теме Вам нет равных: нет воды.космического благополучия и здоровья всем нам и Вам .
Денис Борисов в сфере верстки))) Спасибо за позитивный, полезный и доступный контент!
Круто очень!!! Перебрал кучу видео, остановился на "вечеринках"))) Заходит на Ура!!! Спасибо большое!!!
Моё почтение! Здоровья тебе и твоим близким, друг
Благодарю
Девачки, я снова плачу, за что мне такой бесплатный контент? У меня день рождения?
ВАДИМ, от души...
Вечеринка!
спасибо- нравиться твой стиль работы и мысли
Большое спасибо!!! На позитиве, заряжаешь, красавчик!!!
Красавчик! . жду продолжения истории)))
Марафон огонь, приятно смотреть! Верстаю потихоньку, скоро догоню.
Отличный марафон! Люблю тебя смотреть!)
Спасибо! Как же круто, что я наткнулся на этот канал. Изучение верстки становится веселым и занимательным. Респект
Такие же мысли)
Это лучшее что есть в бесплатном рунете, на тему верстки для новичков. Свободное общение, доступные материалы! Спасибо! Не останавливайся! Уверен в твоем светлом и богатом будущем!
1:28:20 когда спрашивают как продвигаются у тебя дела в изучении верстки
как всегда на высоте - спасииибо
всем привет, отличный марафон, лайк однозначно!
Классная вечеринка!))) Автор молодец!
спасиба что есть такие люди каторые обьясняют и все панятно учусь по вашем видео и хачу в дальнейшим устроится на работу по верстке как устроюсь на работу
буду делать данаты вам добро адуши душевно в душу с уважением😃
Очень хорошо объясняешь. Мне понравилось. Подписался
Спасибо большое! Ты классный)
контейнер родителем быть не может, у него проблемы в жизни
Орууууу ахахахахаха
Ты делаешь доброе дело🙏
Очень подробные понятные объяснения! Дякую!
А есть где нибудь код? Не работает слик, не могу найти ошибку 🤒
Твои уроки очень крутые) Успехов тебе в твоих планах!
на заметку! 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;
результат тот же.
буду смотреть дальше оба варианта, как поведут себя при адаптиве. Спасибо!
Просто кайфуем 😂👍
Подписка и лайк .Буду ждать новые стримы по верстке.
Братан спасибо большой :)
Спасибо большое за марафон! Скажите пожалуйста, при подключении normalize.css нужно писать для тэга свойство box-sizing: border-box?
Много внимания мелочам, это мега круто!!!
Топчик, отличный контент
классная вечеринка получилась
класна та доступна подача матеріалу, дякую)
Видео супер. Вадим, тебе большое спасибо.!!!! Скажи, как называется тема для VSCode?
шикарно!
slider 2:01:30
кнопка 1:52:00
css 30:33
html 9:39
Малый конечно молочага!)) jQuery в топку))
Спасибо большое!!! Круто!!! Респект!!!
если я дам свой телеграм, то можешь прислать етот сайт?
Давай
@@TaimasovK @John_1565
100 мильёнов лайков!!! Спасибо БОЛЬШОЕ!!!!
Реально он круто обоснует
где можно сравнить твой код с собственным, например найти ошибки в коде
спасибо!!
спасибо!
Привет, спасибо за материал. А адаптив будет?
Это...Просто...О%#енно
Спасибо за марофон! Только где макет? Ссылка на чат верстальщиков!
Супер! Щиро дякую!
Хедером называется все что попадает на первый экран без прокрутки (нав бар, тайтл, текст, кнопка и ТД), то что вы называете хедером - называется нав бар
Вадим, хочу записаться на Ваш курс, но ссылка на телеграм ведёт на скачивание приложения, а в контакте, не отвечаете. Как с Вами связаться?
почему вы не делали section 100vh, секция с иконками же не вмещается по высоте первого экрана
СПАСИБО ! Дядя Вадим !
п.с. не сердись на меня за предыдущий коммент , удачи !
Как всегда вместо сериальчика стримчанский с Вадосом)))))
ты мой бро))))))))))
Krasavchik
Клаааас!!!
Подскажите, как с позиционировать placeholder
какие плагины у тебя для css, заметь пожалуйста))
Лукашенко !
доброго дня, не подключается слайдер, до момента подключения все работало корректно
а где исходники? в телеграмме не вижу, чтобы были
Как обойти фичу, когда transform: scale блюрит изображение, в макете был текст, но бывает кнопки и с фото?
зы Постараюсь это задать в чате, если тут не увидите, надеюсь эти вопросы не только мне интересны)
Нужно смотреть на код. Но, как вариант, добавить элементу, который НЕ нужно блюрить обёртку (.wrapper, или просто закинуть в тэг div), и в CSS застилизовать её прямопротивоположно. То есть задать отрицательный transform: scale, либо scale по умолчанию.
Здравствуйте, можно ссылку на фигму с этим дизайном?
Почему в хеадере просто по центру все расставил, если в фигме там по px не все по центру стоит? И расстояние между меню логотипом и телефоном тоже не указали, а просто выставили по центру, так можно делать?
цеэуропейцы без антисоветчины не существуют
сколько вёрстка такого макета стоит в россии?у нас примерно 200-300 баксов.
Чувак, как адаптировать свёрстанный сайт под мобильное устройство?
Зачем использовать line-height, если всего одна строка текста?
заказчик может в дальнейшем добавлять контент в макет на своё усмотрение. так что другие строки вполне допустимо могут появиться
2:45:45 такая жиза))
подскажите пожалуйста есть ли макет в фигма?
я с тобой владос!!!!!!!!!!!!
что за тема в vscode?
а че в одном марафоне бокс-сайзинг только для звездочки, в другом еще для афтер и бифор, а здесь вообще для хтмл, а для бифор и афтер отдельно инхерит? ¿🙈
а где макет?
Добрый день..Простите, если не буду оригинален.
Где брать материалы к этому уроку? Имею ввиду макет
првиет, телеграм в описании, переходите и там листаете до этого проекта, там будет макет
@@vadymprokopchuk Благодарю.
А что это за программа в начале ? где сам сайт
Круто конечно , но если смотреть в 2х, много отвлекаешься на вопросы, хотя сам говоришь что в конце стрима ответишь
Круто, конечно, что ты у нас великий всезнайка, но не все такие, как ты. В чате много новичков, которые задают ему вопросы, возникающие по пути вёрстки. А запись смотрит не меньшее количество новичков, у которых могут быть одинаковые вопросы, которые будут озвучены Вадимом сразу же.
Так что закрой пасть и не кипишуй)
дайте ссылку на макет
не могу в телеге найти этот макет!
Есть видео, где макет про Турагенство, где большое количество картинок, которые заходят за пределы контейнера?
все что было на марафонах все есть на канале
@@vadymprokopchuk Понял спасибо, буду искать. Просто наверное знаете, когда кучу картинок, которые расположены на тексте в качестве украшения сайта.
как ты только успел в 3 дня уложиться. ты наверное очень крутой?
а есть ссылка где можно скачать этот дизайн в фигме? или кто-то может скинуть, пожалуйста)
в телеге
когда вторая часть
Вышла уже давным давно
@@vadymprokopchukсори не видел
@@vadymprokopchuk а так канал у вас топ
еще с 2019 года подписан
доброго дня, підкажіть датупроведення марафону в телеграмі..не можу знайти макет
сам спитав..сам знайшов 3 лютого 2021 року
Как убрать маркеры в списке?...
В когось слайдер зїжав при підключені slick????
Осталось сделать этот сайт и для старичков
я сам не смог сделать, чет жестко новые свойства transform: scale(1.25); я специально не стал сам делать думаю щас посмотрю а там че будет, как хорошо что я не стал сам делать я бы каждый шриф прибавлял и проклял бы этот hover. а тут просто scale черкануть нужно
Вот блин. фигма уже не работает на виндоус 7 (((
а онлайн версия очень сильно тормозит.
что же делать. поддержка виндоус 7 прекращена, и я теперь не смогу скачать обновление KB2533623 а без него фигму не запустить на семерке (((
попробуй установить виртуальную машину, а на неё десятку а там фигму
Де взяти макет дизайну?
телеграм в описі, дальше в файлах
У меня не выровнялось.
Ты Бурят?
Як включити в фігмі ці червоні рамки що на 8:11 ?
Shift+R
Shift + R
Блин, пропустил, дайте макет пожалуйста.
Зайди в его телеграм группу ,вроде в описании под видео должно быть
И прогортай до момента где начинается марафон по этой вёрстке
ахахахаха, вектор вектор вектор и ещё раз вектор говорят мне о том, никогда не догадаетесь..... что это векторXDDDDDDDDDDDDDDDDDDD 47:17
2:30
1:32:00
Я что не пойму где лого... я уже умнее чем ты. Очень смешно))))))))))))))
Нету макета из видео.
в телеге посто 3 февраля. там макет
@@goodcthulhu250 Спасибо.
box sizing border box что это? и как его использовать - ua-cam.com/video/IH_V0duSGLo/v-deo.html
кто диз поставил? обоснуй
2:39:30