Верстка практика

Верстка практика смотреть последние обновления за сегодня на .

Изучаем HTML и CSS на практике. Верстка сайта с размещением в интернете

31576
1018
60
01:19:24
16.02.2021

💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 27 Февраля 2023 года. ↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓ Урок по верстке сайта на HTML и CSS из макета Figma. Верстаем и размещаем работу на хостинге в интернете. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "Профессия HTML верстальщик": 🤍 Обучение с наставником, 3 месяца, результат, гарантия. Старт курса: 27 Февраля 2023 года 💻 Курс "JS Frontend разработчик + React": 🤍 Обучение с наставником, 3 месяца, результат, гарантия. Старт курса: 20 Февраля 2023 года 🏁 Обучение с нуля 💁‍♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Ссылка на макет: 🤍 Сайт: 🤍 Вконтакте: 🤍 Telegram канал: 🤍

Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. HTML CSS

449523
12725
734
03:12:21
07.09.2021

Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. В этом видео я покажу подробную HTML CSS верстку простого макета FIGMA с кучей полезных решений и лайвхаков! Часть №1: 🤍 Часть №2: 🤍 ❓❓ Хотите чтобы стрим остался в записи? 👉Подписываемся на канал "СЛУШАЙ!" Истории из жизни простых людей: 🤍 И ЖМЁМ ЛАЙК! :) Полезные ссылки: 👉 Макет: 🤍 💪 Набор на курс по верстке: 🤍 👉Бесплатный курс по верстке: 🤍 👉 VS Code: 🤍 👉 Как правильно учиться: 🤍 👉 План развития фронтенд разработчика (+КАРТА): 🤍 🔴 Карта канала: 🤍 🔴 Получить доступ к плюшкам + поддержать канал: 🤍 🔴 Instagram: 🤍 🔴 Telegram канал: 🤍 (🤍 🔴 Telegram чат по верстке: 🤍 (🤍 🔴 Facebook: 🤍 👉 🤍IT-ПРИСТРАСТІ, українськомовний канал присвячений інтерв'ю з цікавими IT-спеціалістами - 🤍 👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками! Ссылка на канал: 🤍 🤟 Живи, а работай в свободное время! ©

#1 Верстка сайта по шаблону для начинающих | Верстаем вместе | Сайт ресторана - делаем меню

157850
4706
261
00:19:29
18.02.2022

Привет, друг! Это новая тематика на канале - Верстаем вместе, где ты точно так же можешь повторять за мной шаг за шагом каждое действие, чтобы набраться опыта и в будущем верстать все более сложные сайты! В этом видео я показывай шаг за шагом процесс создания сайта, на этот раз это сайт ресторана. Это только одно из множества видео, дальше будет окончательная верстка, адаптация под мобильные устройства и загрузка на хостинг. То есть мы пройдем вместе весь путь создания сайта. А чтобы не пропустить новые части подпишись! Все ссылки: Ссылка на шаблон: 🤍 Ссылка на проект: 🤍 Ссылка на шрифты: 🤍 Социальные сети: Телеграм канал: 🤍 Инстаграм: 🤍 ВК: 🤍 Нужен сайт? Переходи: 🤍 Поддержать канал: 🤍 Не забудь подписаться!

#1 Верстка сайта для начинающих | Шапка сайта

28240
869
161
01:13:10
03.01.2020

Верстаем макет сайта (лендинга) из Photoshop. Видео для начинающих, практика верстки. В уроке сверстаем шапку сайта. /* Материалы урока */ Код: 🤍 Макет: 🤍 /* Команды урока */ Запуск browser-sync: browser-sync start server files "/*" no-notify /* Ссылки урока */ VS code: 🤍 Google Fonts: 🤍 Normalize css: 🤍 Bem: 🤍 Browser-sync: 🤍 Node.js: 🤍 Git: 🤍 Page Ruler: 🤍 Меня зовут Дмитрий Бердников, я веб-разработчик. На этом канале буду делиться знаниями по веб-разработке. /* Соц. сети */ Мой ВК - 🤍 ♫Music By♫ ●Kronicle - Another Chill Day ●Soundcloud - 🤍 #обучение #верстка

HTML CSS верстка. Практика. Верстаем онлайн кабинет крипто-кошелька

6845
223
15
02:06:05
08.07.2021

💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 27 Февраля 2023 года. ↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓ Онлайн практика по HTML CSS верстке сайтов, админ панелей и онлайн кабинетов. Верстаем кабинет крипто-кошелька. HTML, CSS на препроцессоре SASS/SCSS. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 27 Февраля 2023 года 💻 Курс "JS Frontend разработчик": 🤍 Старт обучения: 20 Февраля 2023 года 🏁 Обучение с нуля 💁‍♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 📍 Материалы к уроку: • Макет урока: 🤍 • Готовый код с урока: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Меня зовут Юрий Ключевский. Я занимаюсь разработкой сайтов уже много лет, специализируюсь на front-end разработке и верстке сайтов, JavaScript и PHP программировании. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, Javascript, JQuery, PHP, MySQL, React, Gulp. На нашем канале 🤍 вы найдете много полезных обучающих материалов, а так же сможете поработать со мной лично пройдя мои курсы. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Сайт школы ВебКадеми: 🤍 Наша группа Вконтакте: 🤍 Telegram канал: 🤍

Практика. Часть 1. Верстка шапки сайта | Курс Веб разработчик | Академия верстки

69804
91
00:37:56
22.08.2018

Ссылка на полный плейлист: 🤍 Это закрытые записи курса веб-разработчик 10.0. Получите полный доступ к домашкам, макетам и дипломному проекту. Переходите по ссылке 👉 🤍 Подпишитесь на канал, если вам нравятся эти видео: 🤍 Больше контента в нашей группе Вконтакте 🤍 Присоединяйтесь к нашему сообществу Discord 🤍 Чтобы записаться на мой курс по основам веб-разработки, напиши в нашу группу и мой ассистент скажет тебе, что делать дальше: 🤍 Прочитай мою историю в блоге: 🤍 Мой канал в telegram "Лысый из браузера" 🤍 Чтобы заказать рекламу на канале, пишите в личку вконтакте: 🤍 или telegram 🤍 - Я использую хостинг Link Host с 2014 года 🤍

ВЕРСТКА САЙТА ⚠️ Стоит ли учить HTML верстку в 2023?

165177
7007
801
00:09:31
19.01.2021

🔥 Интенсив «Первый заработок на создании сайтов» Участие бесплатное, но необходимо зарегистрироваться: 🤍 В этом видео я расскажу, насколько актуальна профессия Верстальщика. Рекомендую подписаться на канал, потому что тут я рассказываю про веб-разработку. 🙌 Если вам нравится то, что я делаю, вы можете поддержать меня на Boosty: 🤍 🔵 Дзен — 🤍 🔵 ВК — 🤍 🔵 Telegram — 🤍 🔵 Чат Telegram — 🤍 🔵 Instagram — 🤍 🔵 TikTok — 🤍 🔴 Задать вопрос — 🤍 🔴 Обучение - 🤍

Верстка сайта 2023. Практика. HTML / SCSS / JavaScript (JS) / Gulp. Часть 1.

6506
366
52
03:36:09
07.01.2023

Данный ролик это первая часть проекта. Делаем верстку сайта 2023. Во второй части сделаем анимации при помощи библиотеки Greensock ( она же GSAP). 🤟 Ссылка на макет : 🤍 🏆 Поддержать канал можно на Patreon: 🤍 🔹 Как благодарность за поддержку на Patreon вы получите мою сборку Gulp: 🤍 🏆 Так же поддержать канал можно в крипте(сборку как благодарность скину): 👉 USDT(ERC20): 0xA4008910De17DB20c7505425316fF72d4C5Eed96 👉 USDT(BEP20): 0x4350c4E1C0bB35634C7fDE1cFB278BE0606E3822 👉 Binance Pay: 432902886 ⏱️ Тайм-коды: ⏱️ 00:00:00 Вступление и осмотр макета 00:02:00 Настройка проекта: шрифты, контейнер, переменные 00:04:30 Header 00:15:35 Секция Hero 00:51:43 Секция Materials 01:14:57 Секция Choose 01:40:12 Секция Help 02:07:52 Секция Examples 02:18:14 Секция с отзывами. Страдаю над слайдером. 02:44:22 Секция Blog 02:56:55 Footer ✅ Интересные ролики, можете посмотреть на досуге: 👉 Урок по MERN Stack: 🤍 👉 Урок по NEXT.js: 🤍 👉 Урок по React Native: 🤍 👉 Урок по Redux Toolkit 2022: 🤍 📨 Сотрудничество ► timoschuk.roman🤍gmail.com 📨 Business inquiries ► timoschuk.roman🤍gmail.com

HTML & CSS практика | Верстаем меню сайта

78939
2317
111
00:15:28
14.03.2021

Дружище, я помог тебе? Подари мне кофе ➡☕ 🤍 Верстаем типичное меню для сайта. Меню бывает разное, но это база для всех вариантов. Не понял какой-то CSS свойство? - ищи его в справочнике и читай о нём: 🤍 ❗ Шаблон для старта из видео: 🤍 🤍 - создание сайтов под ключ 🤍 - мой сайт и соц. сети

Практика верстки #1. Верстка шапки сайта

4199
190
49
00:29:20
14.08.2020

Всем привет! Добро пожаловать на мой канал. Это мое первое видео и возможны некоторые косяки. Поэтому открыт к конструктивной критике в комментариях. Этим роликом я запускаю серию видео по верстке небольшого макета на чистом html и css. Приятного просмотра. Содержание: 00:00 Приветствие 00:29 Подготовка файлов и стили по-умолчанию 08:20 Начало верстки 13:00 Стили контейнера и лого 15:30 Стили навигации 18:30 Стили кнопок 25:12 Расположение элементов Макет: 🤍 ВК: 🤍 #html #css #верстка

Практика JavaScript с нуля за 2 часа. Сделаем целый сайт!

146516
5534
413
02:03:50
09.02.2021

Исходный код тут: 🤍 Получить профессию Frontend разработчика - 🤍 Подробнее узнать об обучении в Result School - 🤍 Бесплатный курс HTML & CSS - 🤍 Сделать 5 проектов на JavaScript - 🤍 Я в соц сетях: Telegram: 🤍 VK: 🤍 Instagram: 🤍 Мои паблики по JavaScript: Telegram: 🤍 VK: 🤍 Instagram: 🤍 JavaScript cообщества: Discord: 🤍 Telegram: 🤍 Roadmap по каналу: 🤍 Решил выложить в открытый доступ курс по созданию конструктора сайтов на чистом JavaScript за 2 часа. Что внутри курса? 🔹 Ты напишешь с нуля приложение, которое сможешь положить себе в портфолио. 🔹 C нуля настроим рабочее окружение. 🔹 Будет много практического применения ООП (ты наконец-то поймешь, зачем на самом деле нужны классы в JavaScript). 🔹 Разберем как принципы SOLID помогают писать расширяемый и поддерживаемый код. 🔹 Оптимизация работы приложения. 🔹 Деплой приложения на хостинг. 🔹 И куча дополнительных бонусов, которые ты найдешь в процессе прохождения курса. Исходный код тут: 🤍 Текстовые редакторы: WebStorm - 🤍 VSCode - 🤍 Инструменты из курса: NodeJS - 🤍 Parcel - 🤍 Документация: 🤍

Практика верстки #1. 4. Верстка блоков с действиями

305
22
7
00:31:28
20.08.2020

Привет. В этом видео я покажу как верстать блоки, что бы их можно было легко обратить. В итоге получим два новых экрана, затратив время только на один. Приятного просмотра! Плейлист с практикой: 🤍 ВК: 🤍 Содержание: 00:00 Начало 00:27 Верстка разметки 03:18 Стилизация 21:13 Декоративные элементы #html #css #верстка

#1 Верстка сайта с нуля для начинающих | HTML, CSS

2836860
78376
3075
00:50:43
27.02.2019

В этом видео начнем верстать сайт с нуля. Верстка сайта это процесс создания сайта из макета, который нарисовал дизайнер. Видео для начинающих, в нем не будет препроцессоров, сборщиков и каких-либо инструментов, только HTML и CSS! Основы HTML и CSS для начинающих: 🤍 Верстка сайта транспортной компании: 🤍 Файлы урока: 🤍 Главы видео: 00:00 - 03:10 - Подготовка к работе 03:10 - Создаем проект 05:35 - Шрифты 09:30 - Can I use? 11:50 - Начинаем верстать главный блок 16:30 - Верстаем шапку 25:40 - Верстаем заголовки 33:30 - Совет и ошибки начинающих 34:40 - Верстаем кнопку 39:00 - Верстаем нижнюю часть Меня зовут Дмитрий Валак. Я занимаюсь разработкой сайтов уже много лет, специализируюсь больше на front-end разработке и верстке сайтов, но и программирование тоже изучаю. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, Javascript, JQuery, Vue, PHP, MySQL, React, Gulp и тд. На сайте проекта 🤍 вы найдете много полезных закрытых материалов, а так же сможете поработать со мной лично, при наличии такого желания. Мой ВК - 🤍 Группа BC - 🤍 Мой Instagram: 🤍 #верстка #версткасайта #html #css #css3

FLEXBOX. Примеры верстки на flex. Учимся верстать на флексах. Часть четвертая - практика

434237
22166
2999
00:42:02
13.11.2019

Продолжаем учить верстку на флексах и пришло время практического занятия. Я сверстаю небольшой макет демонстрируя возможности модуля flexbox применяя его в разный ситуациях. Flexbox - это целый модуль, содержащий в себе набор свойств и их значений как для родителя flex-контейнера так и для его дочерних элементов flex-элементов. Основным преимуществом гибкой FLEX разметки является возможность изменять ширину/высоту пространство вокруг и порядок flex-элементов, для того чтобы наилучшим образом заполнить доступное пространство flex-контейнера. 🔴 Файлы урока: 🤍 🔴 Макет 🤍 🔴 Шпаргалка по Flexbox: 🤍 🔴 Весь плейлист по FlexBox: 🤍 Дополнительно, игра flexboxfroggy: 🤍 Методология БЭМ за 17 минут: 🤍 Sublime Text 3 настройка установка плагины: 🤍 🔴 Получить доступ к плюшкам + поддержать канал: 🤍 🔴 Telegram канал: 🤍 (🤍 🔴 Telegram чат по верстке: 🤍 (🤍 🔴 Facebook: 🤍 🔴 Instagram: 🤍 👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками! Ссылка на канал: 🤍 🤟 Живи, а работай в свободное время! ©

Верстка сайта для самых маленьких, html/css подробное объяснение

98668
4042
351
05:07:58
11.09.2022

Друзья, в этом видео я верстаю полный сайт для новичков в верстке, то есть прям для людей, которые делают самые первые шаги, начинают с самого начала. Эта верстка для самых маленьких в этой сфере, я объясню абсолютно все. Полезные ссылки: макет - 🤍 VSC - 🤍 Figma - 🤍 Все теги и свойства (справочник) - 🤍 Нормалайз - 🤍 Шрифты - 🤍 Мой курс по верстке (закрытая вечеринка=)) - 🤍 Телеграм канал - 🤍 Часть кода, который хотел оставить, сокращение для списка, youtube не разрешил, в целях безопасности. Весь готовый проект вы можете найти у меня на патреон 🤍 Рекомендую после этого видео, пройти марафон по верстке: 1. 🤍 2. 🤍 3. 🤍 Подпишитесь на канал, если вам понравилось данное видео: 🤍

Верстка сайта, html/css/js подробное объяснение

29425
1441
190
01:26:03
12.11.2022

Друзья, в этом видео я верстаю крутецкий сайт гранд финала гонок lamborghini. Сверстаем полный сайт сделаем адаптив, пройдем сложные моменты, я объясню абсолютно все. Полезные ссылки: макет + файлы - 🤍 Мой курс по верстке (закрытая вечеринка=)) - 🤍 Телеграм канал - 🤍 Канал по вебдизайну - 🤍 Рекомендую после этого видео, пройти марафон по верстке: 1. 🤍 2. 🤍 3. 🤍 Подпишитесь на канал, если вам понравилось данное видео: 🤍

Верстка из Figma. Два часа практики от Александра Сокирки

22886
772
72
02:23:14
16.01.2020

Понравилось видео? Поддержки автора на 🤍 и получи уникальные закрытые курсы с практикой и поддержкой автора. (Описание ништяков для подписчиков в этом видео - 🤍 ) Подпишись на меня везде, чтобы не потеряться: - Telegram - 🤍 YouTube - 🤍 Yandex Zen - 🤍 VK - 🤍 FaceBook - 🤍 Instagram - 🤍 LinkedIn - 🤍 Шаблоны для WordPress разработанные автором видео: 🤍 Исходник урока - 🤍 VK Быть Программистом - 🤍 Telegram Быть Программистом - 🤍 Два часа практики верстки из Figma.

#4. Верстка сайта GRID (Практика HTML + CSS)

2490
85
15
00:11:47
16.09.2021

Поддержать автора: 🤍 Исходный код: 🤍 Макет: 🤍 Макет с исправлениями: 🤍 * Музыка: Glacier - Patrick Patrikios

Вторая часть. HTML CSS верстка. Практика. Верстаем онлайн кабинет крипто-кошелька

2904
124
10
02:22:01
09.07.2021

💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 27 Февраля 2023 года. ↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓ Продолжаем практику HTML CSS верстки админ панели, личного кабинет крипто-кошелька. Верстаем на препроцессоре SASS/SCSS. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 27 Февраля 2023 года 💻 Курс "JS Frontend разработчик": 🤍 Старт обучения: 20 Февраля 2023 года 🏁 Обучение с нуля 💁‍♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 📍 Материалы к уроку: • Макет урока: 🤍 • Первая часть: 🤍 • Готовый код с первой части: 🤍 • Готовый код второй части: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Меня зовут Юрий Ключевский. Я занимаюсь разработкой сайтов уже много лет, специализируюсь на front-end разработке и верстке сайтов, JavaScript и PHP программировании. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, Javascript, JQuery, PHP, MySQL, React, Gulp. На нашем канале 🤍 вы найдете много полезных обучающих материалов, а так же сможете поработать со мной лично пройдя мои курсы. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Сайт школы ВебКадеми: 🤍 Наша группа Вконтакте: 🤍 Telegram канал: 🤍

Как выучить HTML & CSS? Самый аху##### способ!

508396
35703
1236
00:08:26
15.10.2019

Лучший способ выучить HTML & CSS с нуля до джедая ;) И всё бесплатно. 🍊 FructCode: 🤍 = 🆇 Ссылки из видео 🆇 𝟭: WebRef: 🤍 𝟮: HtmlBook: 🤍 𝟯: HTML за 1 час: 🤍 𝟰: HTML 5 и CSS 3 на примерах: 🤍 𝟱: Погружение в HTML 5: 🤍 𝟲: W3Schools: 🤍 𝟳: MDN: 🤍 𝟴: Клондайк программиста: 🤍 𝟵: CSS Tricks: 🤍 🔵 Наш TELEGRAM: 🤍 Наш ВК: 🤍 Сотрудничество 🤍 💗 Музыка предоставлена YouTube Audio Library.

АДАПТИВНАЯ ВЕРСТКА САЙТА С НУЛЯ ОГРОМНОГО МАКЕТА. ПОДРОБНЫЙ ГАЙД #1

16545
472
37
01:17:34
15.02.2022

Хеллоу ворлд ребята, я хотел загрузить 11 часовое видео по верстке этого макета, но ютуб не дал мне это сделать, поэтому ловите первую часть по адаптивной верстке макета сайта с подробным пояснением Адаптивная Верстка сайта с нуля: ЧАСТЬ 2: 🤍 ЧАСТЬ 3: 🤍 ЧАСТЬ 4: 🤍 ЧАСТЬ 5: 🤍 👉👉👉За всеми нужными макетами и стартовым шаблоном для верстки который я использую - переходи на мой телеграм канал 🤍 и ищи пост от 15.02.2022 Также тебе может понадобится видео по установке OpenServer: 🤍 🔴🔴🔴 НУЖНЫ МАКЕТЫ ДЛЯ ВЕРСТКИ? 🔴🔴🔴 👉 ТЕЛЕГРАМ-КАНАЛ 🤍 публикует по 2 крутых макета в день 👉Подпишись на наш телеграм-канал: 🤍 👉Задай свой вопрос в чате: 🤍 🔴Instagram: 🤍 ПОНРАВИЛОСЬ ВИДЕО? ПОДПИШИСЬ НА КАНАЛ 🤍 🎓Смотри мой бесплатный курс по верстке и заработай свои первые $100 на фрилансе с нуля. Ссылка на плейлист: 🤍 = 🌐 Хостинг: 🤍 💰 Фриланс Биржа: 🤍 = | МОИ ДРУГИЕ ВИДЕО | Видео Фон Для Текста - 🤍 Стилизация Чекбокс - 🤍 Текст Заполняется Водой - 🤍 Поворот При Наведении На 180 Градусов - 🤍 Смена Цвета Картинки На CSS - 🤍 #верстка #адапртив #адаптивнаяВерстка #фриланс #дневник #верстальщика дневник верстальщика

Создание красивого сайта с Parallax эффектом при скролле | HTML CSS JavaScript

315324
20051
210
01:12:09
16.09.2022

Создание сайта от А до Я (комплексный курс): 🤍 Создание интернет-магазина от А до Я: 🤍 Создание крутого слайдера (+посадка на CMS): 🤍 Все курсы в одном комплекте: 🤍 В этом уроке мы рассмотрим создание красивого сайта с Parallax эффектом при скролле. Сегодня я покажу, как происходит разработка таких крутых сайтов и подробно объясню каждый шаг. Ключевой особенностью данного примера является, конечно-же, реализация эффекта Parallax на сайте - вы удивитесь, насколько просто и быстро можно делать подобные вещи, используя современный CSS. Страница урока: 🤍 Таймкоды: 00:00 Начало урока 01:57 Обзор материалов урока 02:49 Подготовка изображений для Parallax эффекта в CSS 11:28 Приступаем к HTML верстке сайта 13:49 Подключаем файлы CSS и JavaScript 14:55 HTML верстка сайта (вся разметка) 19:54 Приступаем к CSS стилизации 21:02 Подключение шрифтов CSS 22:50 Стилизация тега body 23:58 Верстка шапки сайта - стили parallax слоев 26:21 Параллакс-эффект с помощью JavaScript 31:11 Логика движения слоев Parallax в CSS 36:39 Верстка заголовков сайта и эффект «свечения» 45:32 Полоса между блоками - решение 50:04 CSS стилизация первой секции сайта 56:32 Создание параллакс эффекта у контента 59:09 Плавная прокрутка страницы JS 1:04:41 Анимация Cubic Bezier для Parallax эффекта в CSS 1:10:56 Что ещё изучить? ВКонтакте: 🤍 Телеграм: 🤍 Дзен: 🤍

[2022] Основы верстки сайта с нуля! HTML5 и CSS3 - верстка макета

623381
20237
821
01:06:37
10.06.2020

Современный и актуальный подход к верстке сайтов (лендингов) на HTML5/CSS3 с нуля для начинающих из Figma. Разберемся со всем, что волнует начинающих верстальщиков в одном емком уроке! И... 💻 Онлайн-курс «Веб-верстальщик: начало» - 7 занятий и личный наставник бесплатно: 🤍 🖌️ Макет: 🤍 💻 Верстка с 3-мя эффектами, которых нет в видео: 🤍 ⌨️ Sublime Text 3: 🤍 0:00 Хайлайты 0:26 🎙️ Новый рэп, йоу 1:28 Что нас сегодня ждет 5:04 Редактор кода Sublime Text 3 5:50 Базовая структура и объяснение тегов HTML 11:20 Подключаем шрифты из Google Fonts 15:00 Основы CSS 20:37 ⭐ Самый главный принцип верстки 29:25 Как задать фон картинкой для секции (background) 31:10 Как создать меню в верстке (ul, li) 36:30 Dev tools (инструменты разработчика) в Chrome 44:01 Обидный баг в CSS 47:30 Что такое высота строки (line-height) 48:45 🤩 Как изучать верстку, чтобы было хорошо 56:55 🤔 {HOT!} 5 заповедей профессионального верстальщика 1:02:46 Новый розыгрыш! 🎁 1:03:55 Итоги предыдущего розыгрыша 1-ый эпизод шоу: 🤍 🌃🎓🌙 «Вечерняя школа» - это регулярное шоу для тех, кто хочет освоить дизайн и разработку сайтов. Весело. Нескучно. Чтобы вот прямо захватывало. Идеально смотреть после работы или во время работы, если она надоела и ты хочешь выйти на фриланс. 😉 Андрей Гаврилов - мое имя. Делаю сайты 10 лет. А еще, создал образовательный онлайн-проект WAYUP и здесь же преподаю. Путешествую по всему миру и веду блог: 🤍 🎁 Используй промо-код NIGHTSCHOOL при оплате любого моего коучинга на WAYUP и получи скидку -30%: 🤍 Не забудь 👍 лайкнуть это видео, чтобы не забыть лайкнуть его!

Практика верстки #1. 2. Верстка первого экрана. Кастомный select

1007
52
11
00:40:44
16.08.2020

Всем привет! Вторая часть практики, где мы сверстаем первый экран, сделаем кастомные выпадающие списки и добавим декоративных элементов. Приятного просмотра. Плейлист с практикой: 🤍 Содержание: 00:00 Начало 00:38 Верстка первого экрана 05:30 Стили заголовка 07:58 Стили формы 10:21 Кастомные выпадающие списки 25:40 Стили изображения 33:41 Декоративные элементы ВК: 🤍 #html #css #customselect

Практика верстки. #3/1. Верстка макета на SCSS. Анимация AOS.

1068
49
12
00:23:29
01.12.2020

Привет! Третий плейлист по верстке макета с использованием препроцессора SCSS и анимации элементов. Не забывайте ставить лайк, если видео понравилось и подписаться. Приятного просмотра! Все о шрифтах: 🤍 Практика верстки #2: 🤍 Макет: 🤍 Телеграм: 🤍 Моя страница в ВК: 🤍 Содержание: 00:00 Привет 2:18 Базовая настройка 4:38 Верстка разметки 7:22 Пишем стили 9:44 Оформление лого 13:09 Стилизация кнопок

Верстка сайта для новичков. ч.1

61006
2578
249
02:15:35
14.05.2022

Эгегей! Ура, верстка сайта! Устраивайтесь по удобнее, сейчас начнем маслать по полной. Крутой макет, на его примере можно много интересного создать и там будут необычные фишки. Архив со всем добром для работы - 🤍 Сайт курса по верстке - 🤍 Видео про БЭМ - 🤍 О box-sizing - 🤍 jquery - 🤍 slick - 🤍 шрифты - 🤍 normalize - 🤍 Подпишитесь на канал, если вам понравилось данное видео: 🤍

HTML CSS: практика: препроцессор SASS, верстка макета Portfolio (часть 1)

359
7
2
00:57:13
06.08.2021

Переходите на наш сайт 🤍 где вы найдете бесплатный базовый курс HTML CSS

Уроки React Js на практике верстка сайта для любого начинающего

29122
688
37
00:53:39
23.08.2020

React js стала революционной библиотекой в мире Frontend разработки. Для того что б стать junior javascript разработчиком одно из требований знание данной библиотеки и умение верстать сайты. В этом видео я на практике покажу как происходит верстка сайта на React js для любого начинающего. Для более быстрого написания frontend части нашего сайта мы применим библиотеку Material UI которая отлично работает в связке с React JS.

#1. Верстка сайта GRID (Практика HTML + CSS)

5318
193
30
00:14:00
11.08.2021

Объяснение о том, почему я решил упростить макет, случайно вырезал на монтаже :) Проблема сетки заключается в том, что ее без JS нормально не сделать. Записывая данное видео я рассчитывал на то, что здесь будет только верстка без JS'a Поддержать автора: 🤍 Исходный код: 🤍 Макет: 🤍 Макет с исправлениями: 🤍 Шрифт: 🤍 * Таймкоды: 00:00 Введение 02:30 Добавляем шрифт 04:42 Добавляем цвета 06:36 Скачиваем иконки 13:38 Всем спасибо, всем пока * Музыка: Glacier - Patrick Patrikios

CSS 3. Методология БЭМ. Практика. Вёрстка макета.

1124
50
11
01:07:52
15.07.2022

В данном уроке Вы узнаете о методологии БЭМ, благодаря которой мы научимся правильно, а самое главное логично называть классы элементов. В конце урока мы с Вами на реальном макете закрепим знания полученные в этом уроке, сверстав несколько экранов. Ссылка на макет - 🤍 * Telegram - канал, для общения и помощи в обучении между учениками, которые проходят данный онлайн курс, а также для информирования о новых видео уроках, которые будут выходить в ближайшее время - 🤍 *

Методология БЭМ за 17 минут. Пример верстки по БЭМ методологии // Фрилансер по жизни

560333
30467
1863
00:17:34
04.10.2019

Методология БЭМ это аббревиатура слов блок, элемент, модификатор. Эти объекты и являются основой всей методологии. Основанная в середине 2000х компанией Яндекс, методология БЭМ - всего лишь одна из множества подобных методологий, однако ей удалось получить серьезную популярность. В основе БЭМ лежит принцип разделения интерфейса на независимые блоки, что позволяет легко и быстро выполнять верстку любой сложности и повторно использовать уже существующий код. Сложно? Покажу пример верстки по БЭМ методологии. Пойдем разбираться! Архив с файлами урока качай по ссылке: 🤍 Верстка макета из урока: 🤍 Больше информации по БЭМ 🤍 Настрока плагина eCSStractor для копирования классов по БЭМ 🤍 Содержание: 00:00 - Вступление 01:04 - Блок 03:00 - Элемент 06:02 - Модификатор 07:10 - Микс 08:21 - Практический пример Поддержать канал: 🤍 Instagram: 🤍 Facebook: 🤍 Telegram канал: 🤍 или 🤍 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками! Ссылка на канал: 🤍 «Фрилансер по жизни». Живи, а работай в свободное время! © #фрилансерпожизни #обучение #верстка

Верстка сайта на практике #Shorts

9335
236
8
00:00:15
30.04.2021

Сегодня последний день для сдачи работ, чтобы поучаствовать в конкурсе! Подробности в описании - 🤍 Плейлист с практикой создания сайтов: 🤍 ✅ Поддержать канал — 🤍 ✅ Instagram — 🤍 ✅ TikTok — 🤍 ✅ Сайт — 🤍 ✅ ВК — 🤍 ✅ Telegram — 🤍 ✅ Чат Telegram — 🤍 Обучение Frontend-разработке — 🤍 Frontend Book PDF — 🤍 Задать вопрос про фронтенд или верстку — 🤍

Практика верстки #1. 6. Верстка карточек

408
27
4
00:32:06
24.08.2020

Приветствую! В этом видео мы сверстаем два типа карточек, используя два разных подхода к вставке контентных изображений. Буду рад подписке и любой поддержке канала. Приятного просмотра! Плейлист с практикой: 🤍 ВК: 🤍 Содержание: 00:00 Начало 00:45 Верстка карточек 05:19 Стилизация ссылки "View more" 10:06 Типы изображений на сайте 12:10 Стилизация карточек 20:18 Верстка карточек-историй 22:44 Стилизация карточек-историй 25:37 "Безопасные" изображения #html #css #верстка

Верстка сайта лендинга на HTML, SCSS. Практический урок

27202
946
47
03:15:16
05.08.2021

💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 27 Февраля 2023 года. ↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓ Макет в Telegram канале: 🤍 HTML верстка сайта лендинга. Урок для начинающих. Напишем HTML разметку, применим CSS стили с препроцессором SCSS, используем BEM naming. В этой части мы стартовали? написали сброс стилей, экспортировали всю графику, подключили шрифты. заверстали навигацию, шапку и 2 секции лендинга. Продолжим в следующей части. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 27 Февраля 2023 года 💻 Курс "JS Frontend разработчик": 🤍 Старт обучения: 20 Февраля 2023 года 🏁 Обучение с нуля 💁‍♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: На канале ВебКадеми 🤍 вы найдете много полезных обучающих материалов, а так же сможете поработать со мной лично пройдя мои курсы. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Сайт: 🤍 Вконтакте: 🤍 Telegram канал: 🤍

Практика верстки #1. 7. Адаптация карточек и верстка слайдера

581
26
2
00:44:54
02.09.2020

Привет! Сегодня мы сверстаем и подключим слайдер к нашему проекту. Использовать будем splidejs. Буду рад подписке и любой поддержке канала. Приятного просмотра! Слайдер: 🤍 Плейлист с практикой: 🤍 ВК: 🤍 Содержание: 00:00 Начало 00:20 Адаптация первого блока карточек 00:20 Адаптация первого блока карточек 05:20 Адаптация второго блока карточек 08:30 Разметка слайдера 12:58 Стилизация слайдера 25:00 Подключение SplideJs слайдера 35:00 Стилизация навигационных кнопок #html #css #slider

Верстка сайта Bootstrap 5 / HTML / CSS на практике для новичков

147206
5235
230
00:32:33
19.08.2020

🤗 Зарегистрируйся на хостинге TimeWeb: 🤍 🎁 И получи бонус 179 рублей на счет по промокоду: ANNBLOK Домен в зоне .ru/.рф в подарок! Напиши кодовое слово ANNBLOK в поддержку Документация Bootstrap 5 — 🤍 Пример из видео — 🤍 Таймкоды: 00:00 Вступление 01:11 Хостинг TimeWeb 02:36 Шаг 1 Создание аккаунта на хостинге 04:03 Шаг 2 Подготовка файлов к верстке 05:24 Шаг 3 Подключение Bootstrap 07:17 Шаг 4 Верстка сайта с Bootstrap 29:14 Шаг 5 Перенос файлов на хостинг 30:56 Итоги 🔵 Дзен — 🤍 🔵 ВК — 🤍 🔵 Telegram — 🤍 🔵 Чат Telegram — 🤍 🔵 Instagram — 🤍 🔵 TikTok — 🤍 🔴 Задать вопрос — 🤍 🔴 Обучение - 🤍

БЭМ - верстка вместе и без проблем

4738
260
26
00:19:47
04.02.2020

Презентация из видео: 🤍 Документация: 🤍 Информация по SASS/SCSS: 🤍

Javascript практика. Создание табов на javascript. Уроки JS

69617
4234
339
00:18:30
12.09.2020

Продолжаем серию уроков по javascript. В этом видео будет практика работы с javascript. Вы создадите табы на чистом js! Ссылки Хороший и надежный хостинг: 🤍 Промокоды: brainscloudstart - ускоритель сайта на месяц (при оплате месяца) brainscloudyear - месяц хостинга в подарок (при оплате года) brainscloudyear2x - 3 месяца хостинга в подарок (при оплате 2х лет) Подробно по активации: 🤍 Как воспользоваться промокодом? После регистрации аккаунта и до оплаты услуги необходимо активировать полученный от вебмастера промокод в разделе "Бонусы и промокоды". Оплатить услугу хостинга на требуемый период. - Материалы урока: 🤍 О проекте Меня зовут Дмитрий Валак. Я занимаюсь разработкой сайтов уже много лет, специализируюсь больше на front-end разработке и верстке сайтов, но и программирование тоже изучаю. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, Javascript, JQuery, Vue, PHP, MySQL, React, Gulp и тд. На сайте проекта 🤍 вы найдете много полезных закрытых материалов, а так же сможете поработать со мной лично, при наличии такого желания. // Соц. сети = Мой ВК - 🤍 Группа BC - 🤍 Мой Instagram: 🤍 #javascript #js

Сайт за 5 минут. Начало лендинг пейдж. Практика html и css. Верстка. Одностаничник с работающим меню

4302
193
13
00:05:39
17.06.2021

Создаем одностраничный сайт, который можно использовать, как многостраничный. 😻 Стань спонсором канала и скачивай код из любого видео! Подробнее: 🤍 🔵 Другой Ютуб-канал Виктора с влогом и путешествиями: 🤍 💙 Помощь в развитии обучающего канала: ❤ ДОНАТ: 🤍 (прием средств из любых стран). ❤ ЯндексДеньги: 🤍 (Юмани. Любые карты РФ). Хэштеги: #WebStork #htmlcss #cssпрактика #csseffect #создатьсайт

HTML и CSS - Идеи лендинг пейдж. Практика html5 и css3 | Верстка сайта с нуля. Может пригодиться

774
46
4
00:05:37
13.06.2021

HTML и CSS на практике! Подписывайся на наш канал и учись создавать сайты, приложения и игры! 😻 Стань спонсором канала и скачивай код из любого видео! Подробнее: 🤍 🔵 Другой Ютуб-канал Виктора с влогом и путешествиями: 🤍 💙 Помощь в развитии обучающего канала: ❤ ДОНАТ: 🤍 (прием средств из любых стран). ❤ ЯндексДеньги: 🤍 (Юмани. Любые карты РФ). Хэштеги: #css #css3 #WebStork #урокиcss #урокиcss3 #csseffect #html #html5

Назад
Что ищут прямо сейчас на
верстка практика mucize kashif RoK Dimension FIG OSRS PKing симулятор семьи птиц в роблокс Asekose Rodrygo vs sevilla ymeinaru калай тегиин интернет косуга болады blind prank korean show eng sub Fudge накелар juice wrld music jjk v.a free domain kaha se kharide new single Grupo Firme