Верстка сайта с нуля, для новичков. Марафон по верстке, день 1
Vložit
- čas přidán 6. 09. 2024
- Марафон по верстке сайта. За 3 дня полностью сверстаем сайт и сделаем адаптив. Объясню все что делаю, и зачем. Отвечу на вопросы.
Тема в VSC - плагин Material Theme
Все исходники, инструкция и информация в телеграм канале.
Ссылка на телеграм канал:
t.me/from0to1com
макет - drive.google.c...
Чат верстальщиков:
t.me/chat_from...
Как создавался этот дизайн:
• Дизайн сайта
Написать мне в ВК:
vadimpr...
Написать мне в телеграм:
t.me/silver8li...
Отзывы о моем авторском курсе по верстке:
topic-1...
Подпишитесь на канал, если вам понравилось данное видео:
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?
Малый конечно молочага!)) jQuery в топку))
СПАСИБО ! Дядя Вадим !
п.с. не сердись на меня за предыдущий коммент , удачи !
100 мильёнов лайков!!! Спасибо БОЛЬШОЕ!!!!
slider 2:01:30
кнопка 1:52:00
css 30:33
html 9:39
Спасибо большое! Ты классный)
Как обойти фичу, когда transform: scale блюрит изображение, в макете был текст, но бывает кнопки и с фото?
зы Постараюсь это задать в чате, если тут не увидите, надеюсь эти вопросы не только мне интересны)
Нужно смотреть на код. Но, как вариант, добавить элементу, который НЕ нужно блюрить обёртку (.wrapper, или просто закинуть в тэг div), и в CSS застилизовать её прямопротивоположно. То есть задать отрицательный transform: scale, либо scale по умолчанию.
Ты делаешь доброе дело🙏
Зачем использовать line-height, если всего одна строка текста?
заказчик может в дальнейшем добавлять контент в макет на своё усмотрение. так что другие строки вполне допустимо могут появиться
Твои уроки очень крутые) Успехов тебе в твоих планах!
почему вы не делали section 100vh, секция с иконками же не вмещается по высоте первого экрана
цеэуропейцы без антисоветчины не существуют
Топчик, отличный контент
Братан спасибо большой :)
Лукашенко !
Спасибо большое!!! Круто!!! Респект!!!
если я дам свой телеграм, то можешь прислать етот сайт?
Давай
@@TaimasovK @John_1565
Спасибо за марофон! Только где макет? Ссылка на чат верстальщиков!
шикарно!
Есть видео, где макет про Турагенство, где большое количество картинок, которые заходят за пределы контейнера?
все что было на марафонах все есть на канале
@@vadymprokopchuk Понял спасибо, буду искать. Просто наверное знаете, когда кучу картинок, которые расположены на тексте в качестве украшения сайта.
Привет, спасибо за материал. А адаптив будет?
Реально он круто обоснует
Подскажите, как с позиционировать placeholder
а че в одном марафоне бокс-сайзинг только для звездочки, в другом еще для афтер и бифор, а здесь вообще для хтмл, а для бифор и афтер отдельно инхерит? ¿🙈
а где макет?
Клаааас!!!
Krasavchik
спасибо!
ты мой бро))))))))))
когда вторая часть
Вышла уже давным давно
@@vadymprokopchukсори не видел
@@vadymprokopchuk а так канал у вас топ
еще с 2019 года подписан
Вадим, хочу записаться на Ваш курс, но ссылка на телеграм ведёт на скачивание приложения, а в контакте, не отвечаете. Как с Вами связаться?
доброго дня, не подключается слайдер, до момента подключения все работало корректно
Круто конечно , но если смотреть в 2х, много отвлекаешься на вопросы, хотя сам говоришь что в конце стрима ответишь
Круто, конечно, что ты у нас великий всезнайка, но не все такие, как ты. В чате много новичков, которые задают ему вопросы, возникающие по пути вёрстки. А запись смотрит не меньшее количество новичков, у которых могут быть одинаковые вопросы, которые будут озвучены Вадимом сразу же.
Так что закрой пасть и не кипишуй)
Почему в хеадере просто по центру все расставил, если в фигме там по px не все по центру стоит? И расстояние между меню логотипом и телефоном тоже не указали, а просто выставили по центру, так можно делать?
подскажите пожалуйста есть ли макет в фигма?
я с тобой владос!!!!!!!!!!!!
Добрый день..Простите, если не буду оригинален.
Где брать материалы к этому уроку? Имею ввиду макет
првиет, телеграм в описании, переходите и там листаете до этого проекта, там будет макет
@@vadymprokopchuk Благодарю.
А что это за программа в начале ? где сам сайт
2:45:45 такая жиза))
я не понимаю где этот макет скачать😅
Здравствуйте, можно ссылку на фигму с этим дизайном?
а где исходники? в телеграмме не вижу, чтобы были
доброго дня, підкажіть датупроведення марафону в телеграмі..не можу знайти макет
сам спитав..сам знайшов 3 лютого 2021 року
Чувак, как адаптировать свёрстанный сайт под мобильное устройство?
В когось слайдер зїжав при підключені slick????
дайте ссылку на макет
сколько вёрстка такого макета стоит в россии?у нас примерно 200-300 баксов.
какие плагины у тебя для css, заметь пожалуйста))
У меня не выровнялось.
А где брать макет из этого видео?
тут можно drive.google.com/file/d/1W9PAVRFWb2kRjry529YjtPIwVKFZLtoG/view?usp=sharing
Как убрать маркеры в списке?...
как ты только успел в 3 дня уложиться. ты наверное очень крутой?
не могу в телеге найти этот макет!
Осталось сделать этот сайт и для старичков
я сам не смог сделать, чет жестко новые свойства transform: scale(1.25); я специально не стал сам делать думаю щас посмотрю а там че будет, как хорошо что я не стал сам делать я бы каждый шриф прибавлял и проклял бы этот hover. а тут просто scale черкануть нужно
а есть ссылка где можно скачать этот дизайн в фигме? или кто-то может скинуть, пожалуйста)
в телеге
что за тема в vscode?
ахахахаха, вектор вектор вектор и ещё раз вектор говорят мне о том, никогда не догадаетесь..... что это векторXDDDDDDDDDDDDDDDDDDD 47:17
Ты Бурят?
Вот блин. фигма уже не работает на виндоус 7 (((
а онлайн версия очень сильно тормозит.
что же делать. поддержка виндоус 7 прекращена, и я теперь не смогу скачать обновление KB2533623 а без него фигму не запустить на семерке (((
попробуй установить виртуальную машину, а на неё десятку а там фигму
Блин, пропустил, дайте макет пожалуйста.
Зайди в его телеграм группу ,вроде в описании под видео должно быть
И прогортай до момента где начинается марафон по этой вёрстке
Як включити в фігмі ці червоні рамки що на 8:11 ?
Shift+R
Shift + R
Де взяти макет дизайну?
телеграм в описі, дальше в файлах
2:39:30
Нету макета из видео.
в телеге посто 3 февраля. там макет
@@goodcthulhu250 Спасибо.
Я что не пойму где лого... я уже умнее чем ты. Очень смешно))))))))))))))
box sizing border box что это? и как его использовать - czcams.com/video/IH_V0duSGLo/video.html
2:30
кто диз поставил? обоснуй