D4mations.com

⚡️ Адаптивная верстка сайта с нуля для начинающих | HTML, CSS и JavaScript | Создаем сайт про NFT

[ad_1]
https://i.ytimg.com/vi/mf3s6J5V8cE/hqdefault.jpg



В этом видео мы вместе сверстаем простой макет на тему NFT, используя HTML, CSS и немного JavaScript. Также мы адаптируем страницу под разные экраны.

⚡️ Макеты и демо можно получить через донат:

1) по подписке (доступ ко всем макетам) https://boosty.to/annblok
2) по подписке (доступ ко всем макетам) https://vk.com/donut/tpverstak
3) разовая оплата через крипту с получением одного макета https://new.donatepay.ru/@annblok (в комментариях напишите email)

✌️ Материалы видео:

1) Шрифт – https://fonts.google.com/specimen/Poppins?query=pop&subset=latin
2) Normilize – https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css
3) Live Server – https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
4) Prettier – https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
5) PerfectPixel – https://chrome.google.com/webstore/detail/perfectpixel-by-welldonec/dkaagdgjmgdmbnecmcefdhjekcoceebi?hl=ru
6) Collapse – https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_collapsible_symbol

👉 Таймкоды:

00:00:00 Вступление
00:01:31 Подготовка проекта
00:05:19 Установка Live Server
00:06:40 Разметка шапки сайта с HTML
00:13:39 Стилизуем шапку с CSS
00:34:28 Разметка и стили для главного блока
00:59:21 Разметка и стили для карточек
01:25:00 Разметка и стили для FAQ
01:35:00 Разметка и стили для баннера
01:40:42 Работа с адаптивом

🔵 Дзен — https://zen.yandex.ru/annblok
🔵 ВК — https://vk.com/tpverstak
🔵 Telegram — https://t.me/tpverstak
🔵 Чат Telegram — https://t.me/tpverstakchat
🔵 Instagram — https://www.instagram.com/annblok/
🔵 TikTok — https://www.tiktok.com/@annblok_webdev

🔴 Задать вопрос — https://frontendhelp.me/ru
🔴 Обучение – https://frontendblok.com/

Original source

d4mer

,
, , ,

37 responses to “⚡️ Адаптивная верстка сайта с нуля для начинающих | HTML, CSS и JavaScript | Создаем сайт про NFT”

  1. ⚡ Макеты и демо можно получить через донат:

    1) по подписке (доступ ко всем макетам) https://boosty.to/annblok
    2) по подписке (доступ ко всем макетам) https://vk.com/donut/tpverstak
    3) разовая оплата через крипту с получением одного макета https://new.donatepay.ru/@annblok (в комментариях напишите email)

  2. Здравствуйте, почему лого сайта вы прописали не через img в самом html ,а через css? Ответьте пожалуйста.
    P.s просто прохожу курс от скилбокс и там говорится что декоративные изображение нужно прописывать в css а контент изображение через img..

  24. Очень круто!
    Анна подскажите пожалуйста где можно посмотреть какой-нибудь гайд на подобие ваших, только о том как создавать качественные синиматики? Весь интернет прополз, а ничего конкретного или полезного не нашел(((
    Может вы что-то об этом знаете?

  25. Аня, не двигайте макет во время верстки
    Гораздо понятнее его зафиксировать в 0 положении и верстать в firefox где можно выставить реальное разрешение без даунскейла как в хроме
    Макет во время пиксельперфект нужно блокировать и тогда он не будет мешать инспектору, и для удобства я накидываю инверсию

    Более того fierfox позволяет настраивать стили прямо в браузере и ведет историю изменения стилей откуда удобно их копировать

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

  26. Анна, я живу во Львове, нас тут заблокировали от России и к сожалению не могу на бусти к тебе подключиться. Буду ждать освобождения своего города и тогда я обязательно подпишусь к тебе ❤️

  27. Спасибо я в Херсоне живу и ещё недавно не мог подписаться на вас из за того что наши банки не позволяли но теперь Херсон стал Русским и я легко подписался

  30. С этого канала. Я наверное вообще ничего полезного не вынес, за всё время. Сегодня $140 на верстке за ночь заработал

Leave a Reply