Одну секунду
Что-то сучилось. Попробуйте еще раз.
Верстка практика смотреть последние обновления за сегодня на .
Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. В этом видео я покажу подробную HTML CSS верстку простого макета FIGMA с кучей полезных решений и лайвхаков! Часть №1: 🤍 Часть №2: 🤍 ❓❓ Хотите чтобы стрим остался в записи? 👉Подписываемся на канал "СЛУШАЙ!" Истории из жизни простых людей: 🤍 И ЖМЁМ ЛАЙК! :) Полезные ссылки: 👉 Макет: 🤍 💪 Набор на курс по верстке: 🤍 👉Бесплатный курс по верстке: 🤍 👉 VS Code: 🤍 👉 Как правильно учиться: 🤍 👉 План развития фронтенд разработчика (+КАРТА): 🤍 🔴 Карта канала: 🤍 🔴 Получить доступ к плюшкам + поддержать канал: 🤍 🔴 Instagram: 🤍 🔴 Telegram канал: 🤍 (🤍 🔴 Telegram чат по верстке: 🤍 (🤍 🔴 Facebook: 🤍 👉 🤍IT-ПРИСТРАСТІ, українськомовний канал присвячений інтерв'ю з цікавими IT-спеціалістами - 🤍 👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками! Ссылка на канал: 🤍 🤟 Живи, а работай в свободное время! ©
Лучший способ выучить HTML & CSS с нуля до джедая ;) И всё бесплатно. 🍊 FructCode: 🤍 = 🆇 Ссылки из видео 🆇 𝟭: WebRef: 🤍 𝟮: HtmlBook: 🤍 𝟯: HTML за 1 час: 🤍 𝟰: HTML 5 и CSS 3 на примерах: 🤍 𝟱: Погружение в HTML 5: 🤍 𝟲: W3Schools: 🤍 𝟳: MDN: 🤍 𝟴: Клондайк программиста: 🤍 𝟵: CSS Tricks: 🤍 🔵 Наш TELEGRAM: 🤍 Наш ВК: 🤍 Сотрудничество 🤍 💗 Музыка предоставлена YouTube Audio Library.
Продолжаем учить верстку на флексах и пришло время практического занятия. Я сверстаю небольшой макет демонстрируя возможности модуля flexbox применяя его в разный ситуациях. Flexbox - это целый модуль, содержащий в себе набор свойств и их значений как для родителя flex-контейнера так и для его дочерних элементов flex-элементов. Основным преимуществом гибкой FLEX разметки является возможность изменять ширину/высоту пространство вокруг и порядок flex-элементов, для того чтобы наилучшим образом заполнить доступное пространство flex-контейнера. 🔴 Файлы урока: 🤍 🔴 Макет 🤍 🔴 Шпаргалка по Flexbox: 🤍 🔴 Весь плейлист по FlexBox: 🤍 Дополнительно, игра flexboxfroggy: 🤍 Методология БЭМ за 17 минут: 🤍 Sublime Text 3 настройка установка плагины: 🤍 🔴 Получить доступ к плюшкам + поддержать канал: 🤍 🔴 Telegram канал: 🤍 (🤍 🔴 Telegram чат по верстке: 🤍 (🤍 🔴 Facebook: 🤍 🔴 Instagram: 🤍 👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками! Ссылка на канал: 🤍 🤟 Живи, а работай в свободное время! ©
💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 18 Сентября 2023 года. ↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓ Урок по верстке сайта на HTML и CSS из макета Figma. Верстаем и размещаем работу на хостинге в интернете. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "Профессия HTML верстальщик": 🤍 Обучение с наставником, 3 месяца, результат, гарантия. Старт курса: 18 Сентября 2023 года 💻 Курс "JS Frontend разработчик + React": 🤍 Обучение с наставником, 3 месяца, результат, гарантия. Старт курса: 23 Октября 2023 года 🏁 Обучение с нуля 💁♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Ссылка на макет: 🤍 Сайт: 🤍 Вконтакте: 🤍 Telegram канал: 🤍
Привет, друг! Это новая тематика на канале - Верстаем вместе, где ты точно так же можешь повторять за мной шаг за шагом каждое действие, чтобы набраться опыта и в будущем верстать все более сложные сайты! В этом видео я показывай шаг за шагом процесс создания сайта, на этот раз это сайт ресторана. Это только одно из множества видео, дальше будет окончательная верстка, адаптация под мобильные устройства и загрузка на хостинг. То есть мы пройдем вместе весь путь создания сайта. А чтобы не пропустить новые части подпишись! Все ссылки: Ссылка на шаблон: 🤍 Ссылка на проект: 🤍 Ссылка на шрифты: 🤍 Социальные сети: Телеграм канал: 🤍 Инстаграм: 🤍 ВК: 🤍 Нужен сайт? Переходи: 🤍 Поддержать канал: 🤍 Не забудь подписаться!
💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 18 Сентября 2023 года. ↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓ Онлайн практика по HTML CSS верстке сайтов, админ панелей и онлайн кабинетов. Верстаем кабинет крипто-кошелька. HTML, CSS на препроцессоре SASS/SCSS. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 18 Сентября 2023 года 💻 Курс "JS Frontend разработчик": 🤍 Старт обучения: 23 Октября 2023 года 🏁 Обучение с нуля 💁♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 📍 Материалы к уроку: • Макет урока: 🤍 • Готовый код с урока: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Меня зовут Юрий Ключевский. Я занимаюсь разработкой сайтов уже много лет, специализируюсь на front-end разработке и верстке сайтов, JavaScript и PHP программировании. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, Javascript, JQuery, PHP, MySQL, React, Gulp. На нашем канале 🤍 вы найдете много полезных обучающих материалов, а так же сможете поработать со мной лично пройдя мои курсы. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Сайт школы ВебКадеми: 🤍 Наша группа Вконтакте: 🤍 Telegram канал: 🤍
Друзья, в этом видео я верстаю полный сайт для новичков в верстке, то есть прям для людей, которые делают самые первые шаги, начинают с самого начала. Эта верстка для самых маленьких в этой сфере, я объясню абсолютно все. Полезные ссылки: макет - 🤍 VSC - 🤍 Figma - 🤍 Все теги и свойства (справочник) - 🤍 Нормалайз - 🤍 Шрифты - 🤍 Мой курс по верстке (закрытая вечеринка=)) - 🤍 Телеграм канал - 🤍 Часть кода, который хотел оставить, сокращение для списка, youtube не разрешил, в целях безопасности. Весь готовый проект вы можете найти у меня на патреон 🤍 Рекомендую после этого видео, пройти марафон по верстке: 1. 🤍 2. 🤍 3. 🤍 Подпишитесь на канал, если вам понравилось данное видео: 🤍
Исходный код тут: 🤍 Получить профессию 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 - 🤍 Документация: 🤍
Получить профессию Frontend разработчика - 🤍 Подробнее узнать об обучении в Result School - 🤍 Бесплатный курс HTML & CSS - 🤍 Сделать 5 проектов на JavaScript - 🤍 Я в соц сетях: Telegram: 🤍 VK: 🤍 Instagram: 🤍 Мои паблики по JavaScript: Telegram: 🤍 VK: 🤍 Instagram: 🤍 JavaScript cообщества: Discord: 🤍 Telegram: 🤍 Roadmap по каналу: 🤍 Как быстро начать программировать? Практический способ, который позволит улучшить код уже через 6 минут видео А ты знаешь как начать программировать на javascript?
Ссылка на полный плейлист: 🤍 Это закрытые записи курса веб-разработчик 10.0. Получите полный доступ к домашкам, макетам и дипломному проекту. Переходите по ссылке 👉 🤍 Подпишитесь на канал, если вам нравятся эти видео: 🤍 Больше контента в нашей группе Вконтакте 🤍 Присоединяйтесь к нашему сообществу Discord 🤍 Чтобы записаться на мой курс по основам веб-разработки, напиши в нашу группу и мой ассистент скажет тебе, что делать дальше: 🤍 Прочитай мою историю в блоге: 🤍 Мой канал в telegram "Лысый из браузера" 🤍 Чтобы заказать рекламу на канале, пишите в личку вконтакте: 🤍 или telegram 🤍 - Я использую хостинг Link Host с 2014 года 🤍 Телеграм-каналы с дизайн-макетами для тренировки вёрстки: 🤍 🤍 🤍 Каналы с крутыми фичами на CSS и JavaScript: 🤍 🤍 Канал с терминами для айтишников: 🤍 Канал, где публикуют ссылки на полезные сервисы и сайты: 🤍
🔥 Интенсив «Первый заработок на создании сайтов» Участие бесплатное, но необходимо зарегистрироваться: 🤍 В этом видео я расскажу, насколько актуальна профессия Верстальщика. Рекомендую подписаться на канал, потому что тут я рассказываю про веб-разработку. 🙌 Если вам нравится то, что я делаю, вы можете поддержать меня на Boosty: 🤍 🔵 Дзен — 🤍 🔵 ВК — 🤍 🔵 Telegram — 🤍 🔵 Чат Telegram — 🤍 🔵 Instagram — 🤍 🔵 TikTok — 🤍 🔴 Задать вопрос — 🤍 🔴 Обучение - 🤍
Дружище, я помог тебе? Подари мне кофе ➡☕ 🤍 Верстаем типичное меню для сайта. Меню бывает разное, но это база для всех вариантов. Не понял какой-то CSS свойство? - ищи его в справочнике и читай о нём: 🤍 ❗ Шаблон для старта из видео: 🤍 🤍 - создание сайтов под ключ 🤍 - мой сайт и соц. сети
В этом видео начнем верстать сайт с нуля. Верстка сайта это процесс создания сайта из макета, который нарисовал дизайнер. Видео для начинающих, в нем не будет препроцессоров, сборщиков и каких-либо инструментов, только 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
Друзья, в этом видосе я верстаю интересный сайтец, с множеством неочевидных на первый взгляд вещей. По максимум использую css grid потому что этот сайт предусматревает такую вечеринку. Макет + шрифты: 🤍 Мой курс по верстке - 🤍 Телеграм канал - 🤍 Большой гайд по гридам - 🤍 О box-sizing - 🤍 Видос по svg - 🤍 Плейлист по Figma: 🤍 Подпишитесь на канал, если вам понравилось данное видео: 🤍
🤟 Все дизайны тут : 🤍 🔥 Обе сборки можно получить по ссылке: 🤍 🏆 Поднять мотивацию и получить плюшки(исходники, чат со мной): 🔹 Patreon: 🤍 🔹 Buy me a coffee: 🤍 🔹 Crypto: 👉 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 📨 Сотрудничество ► timoschuk.roman🤍gmail.com 📨 Business inquiries ► timoschuk.roman🤍gmail.com
Привет!📢 В этом уроке мы верстаем целую страницу сайта с нуля и с адаптивностью под мобильные устройства. Верстаем страницу с помощью css flexbox. Что важно, для адаптивности не используем ни одного медиа запроса (🤍media). Также расскажу подробнее про css свойство background. Этот урок - хорошая практика для вас в закреплении HTML, CSS, FLEXBOX материалов, по которым также у меня есть уроки. Все необходимые файлы к уроку и сам файл проекта прикреплены под этим видео в моём телеграм-канале ▶ Telegram: 🤍 НЕ СОМНЕВАЙТЕСЬ И РАЗВИВАЙТЕСЬ! У ВАС ВСЁ ПОЛУЧИТСЯ! :) Желаю приятного обучения! 🔥 Таймкоды: 00:00 – Интро, обзор проекта 03:21 – Начало работы 04:28 – Подключение шрифтов 05:39 –Изображение в рамке. Свойство BACKGROUND 10:28 – Фон для заголовков 14:16 – Блок про метрополитен. FLEXBOX 21:57 – Блок «куда можно сходить» 25:05 – Кнопка 27:23 – Background fixed 29:44 - Напутствие Также тебе могут быть полезны эти уроки: 📢 HTML для начинающих за 33 минуты: 🤍 📢 CSS для начинающих + практика за 24 минуты: 🤍 📢 FLEXBOX. Всё о flexbox в одном уроке: 🤍 📢 FLEXBOX. Всё о flexbox | Практика: 🤍 ▶ Телеграм: 🤍 ▶ Мой канал по видеомонтажу: 🤍 📢 Автор видеоурока: Дмитрий Колотильщиков #html #верстка #flexbox
Всем привет, добро пожаловать, на первый урок из моего нового курса по вёрстке сайта для начинающих Верстать будем на чистом HTML | CSS без дополнительных инструментов. Нужен хостинг? 🤍 Сервис по доменам и хостингу, регистрируйся по ссылке, получи скидку! HtmlBase - 🤍 Это новый курс по вёрстке, верстаем магазин Дизайн - 🤍 Яндекс диск - 🤍 Drive Google - 🤍 Brackets - 🤍 VsCode - 🤍 Поддержать канал - 🤍 Телеграм чат - 🤍 #Вёрстка #HTML #CSS
Продолжаем серию уроков по javascript. В этом видео будет практика работы с javascript. Вы создадите табы на чистом js! Ссылки Хороший и надежный хостинг: 🤍 Промокоды: brainscloudstart - ускоритель сайта на месяц (при оплате месяца) brainscloudyear - месяц хостинга в подарок (при оплате года) brainscloudyear2x - 3 месяца хостинга в подарок (при оплате 2х лет) Подробно по активации: 🤍 Как воспользоваться промокодом? После регистрации аккаунта и до оплаты услуги необходимо активировать полученный от вебмастера промокод в разделе "Бонусы и промокоды". Оплатить услугу хостинга на требуемый период. - Материалы урока: 🤍 О проекте Меня зовут Дмитрий Валак. Я занимаюсь разработкой сайтов уже много лет, специализируюсь больше на front-end разработке и верстке сайтов, но и программирование тоже изучаю. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, Javascript, JQuery, Vue, PHP, MySQL, React, Gulp и тд. На сайте проекта 🤍 вы найдете много полезных закрытых материалов, а так же сможете поработать со мной лично, при наличии такого желания. // Соц. сети = Мой ВК - 🤍 Группа BC - 🤍 Мой Instagram: 🤍 #javascript #js
Заканчиваем изучать Grid Layout и сегодня применим ранее изученные знания на практике. А именно сверстаем простой макет, галерею и карточки товаров сугубо с помощью Grid Layout. Вперед! 👉 Шпаргалка по Grid (в разработке) - 🤍 👉 Результат практики - 🤍 👉 Правильное адаптивное меню бургер - 🤍 👉 Адаптивные изображения - 🤍 🔴 Получить доступ к плюшкам + поддержать канал: 🤍 🔴 Telegram канал: 🤍 (🤍 🔴 Telegram чат по верстке: 🤍 (🤍 🔴 Facebook: 🤍 🔴 Instagram: 🤍 Содержание: 00:00 - Вступление 00:41 - Пишем HTML 06:30 - Основная грид сетка страницы 08:57 - Верстаем header 13:57 - Верстаем основной блок 15:38 - Верстаем галерею 18:49 - Верстаем товары 25:13 - Верстаем footer 26:10 - Адаптив грид сетки 33:30 - Заключение + шпаргалка 👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками! Ссылка на канал: 🤍 🤟 Живи, а работай в свободное время! ©
Друзья, в этом видео я верстаю полный многостраничный сайт для новичков в верстке, то есть прям для людей, которые делают самые первые шаги, начинают с самого начала. Мы будем писать html/css/js, обсудим заливку на хостинг, связь страниц и так далее. Полезные ссылки: макет: 🤍 box-sizing: 🤍 - Мой курс по верстке - 🤍 - Телеграм канал - 🤍 Весь готовый проект вы можете найти у меня на патреон 🤍 Подпишитесь на канал, если вам понравилось данное видео: 🤍
Друзья, в видео я полностью расскажу, что такое метод верстки mobile first. Не только расскажу, но и как всегда, мы закрепим с вами все на практике, и сверстаем полностью сайтец с дизайном на 5 экранов. Посмотрим на другой подход к адаптиву в верстке. Макет: 🤍 Начальная сборка: 🤍 Шрифты делал тут: 🤍 Видео по препроцессорам: 🤍 Видео по gulp: ч1 - 🤍 ч2 - 🤍 Подпишитесь на канал, если вам понравилось данное видео: 🤍
Создаем одностраничный сайт, который можно использовать, как многостраничный. 😻 Стань спонсором канала и скачивай код из любого видео! Подробнее: 🤍 🔵 Другой Ютуб-канал Виктора с влогом и путешествиями: 🤍 💙 Помощь в развитии обучающего канала: ❤ ДОНАТ: 🤍 (прием средств из любых стран). ❤ ЯндексДеньги: 🤍 (Юмани. Любые карты РФ). Хэштеги: #WebStork #htmlcss #cssпрактика #csseffect #создатьсайт
🤟 Все дизайны тут : 🤍 🔥 Обе сборки можно получить по ссылке: 🤍 🏆 Поднять мотивацию и получить плюшки(исходники, чат со мной): 🔹 Patreon: 🤍 🔹 Как благодарность за поддержку на Patreon вы получите мою сборку Gulp: 🤍 🇺🇦 Карта monobank: 5375414103949789 💸 Так же поддержать канал можно в крипте(сборку как благодарность скину): 👉 USDT(ERC20): 0xA4008910De17DB20c7505425316fF72d4C5Eed96 👉 USDT(BEP20): 0x4350c4E1C0bB35634C7fDE1cFB278BE0606E3822 👉 Binance Pay: 432902886 ⏱️ Тайм-коды: ⏱️ 00:00 Обзор проекта 00:00:57:57 Установка Tailwind 04:42 Настройка конфига 12:12 Header + Burger menu 22:50 Разработка Burger menu 40:24 Секция Hero 01:03:59 Как добавить 🤍keyframe в Tailwind config? 01:07:14 Секция спонсоров 01:14:08 Секция с табами 01:47:08 Секция с преимуществами 01:58:34 Секции с фотками 02:07:50 Секция News 02:27:58 Секция с аккордеоном 02:52:28 Секция Subscribe 03:07:06 Footer 03:23:00 Заключение ✅ Интересные ролики, можете посмотреть на досуге: 👉 Урок по MERN Stack: 🤍 👉 Урок по NEXT.js: 🤍 👉 Урок по React Native: 🤍 👉 Урок по Redux Toolkit 2022: 🤍 📨 Сотрудничество ► timoschuk.roman🤍gmail.com 📨 Business inquiries ► timoschuk.roman🤍gmail.com
Адаптивная верстка - это метод создания веб-страниц, который позволяет сайту адаптироваться под различные устройства и экраны, включая смартфоны, планшеты и настольные компьютеры. В этом видео я расскажу о принципах адаптивной верстки и какие инструменты и технологии используются для ее реализации. Мы также сделаем адаптивку целого сайта и уже на практике закрепим нашу теорию. Также, поговорим о типах верстки. Не забывайте ставить лайки и подписываться! #html #css #htmlandcsstutorialforbeginners #htmltutorial #htmlcss #версткасайта
Мы продолжаем урок верстка сайта с нуля по макету и в этом видео мы изучим CSS Grid. Ну кто изучит, кто вспомнит, кто научится правильно применять. На самом деле css grid даже по круче flexbox будет в верстке сайтов, и при том намного интереснее и функциональнее. В этом видео не будет полноценного туториала по grid но я покажу самые основные свойства с которыми вы будете работать каждый день используя гриды. WBLOGHOST – скидка 40% на любой пакет виртуального хостинга по ссылке 🤍 Если надоел ваш текущий хостинг, то HOSTiQ перевезет бесплатно на оставшийся оплаченный срок у старого хостера. Подробнее: 🤍 Ссылка на макет: 🤍
Чтобы записаться на мой курс по основам веб-разработки, напиши в нашу группу и мой ассистент скажет тебе, что делать дальше: 🤍 Получить нужные материалы для любого веб-разработчика - 🤍 Получить консультацию куратора - 🤍 Связаться с автором: 🤍 telegram: 🤍 Мой блог: 🤍 Больше контента в нашей группе Вконтакте 🤍 Присоединяйтесь к нашему сообществу Discord 🤍 Мой канал в telegram "Лысый из браузера" 🤍 Еще у нас скоро стартует курс обучения. Напиши моему ассистенту: 🤍 - Я использую хостинг Link Host с 2014 года 🤍 Телеграм-каналы с дизайн-макетами для тренировки вёрстки: 🤍 🤍 🤍 Каналы с крутыми фичами на CSS и JavaScript: 🤍 🤍 Канал с терминами для айтишников: 🤍 Канал, где публикуют ссылки на полезные сервисы и сайты: 🤍
Поддержать автора: 🤍 Исходный код: 🤍 Макет: 🤍 Макет с исправлениями: 🤍 * Музыка: Glacier - Patrick Patrikios
Мы продолжаем рубрику улучшаем код и в этом видео мы поговорим про топ 7 фишек html css для верстки сайта, котоые вы должны знать. Верстка сайта на самом деле не такая сложная как кажется на первый взгляд, да и html css кажется для начинающих темным лесом. В этом видео я покажу как легким способом сделать паралакс эфеект на вашей странице, добавить анимации CSS и многое другое, что поможет вам в дальнейшем быстрее верстать и применять в своей работе.
Сегодня последний день для сдачи работ, чтобы поучаствовать в конкурсе! Подробности в описании - 🤍 Плейлист с практикой создания сайтов: 🤍 ✅ Поддержать канал — 🤍 ✅ Instagram — 🤍 ✅ TikTok — 🤍 ✅ Сайт — 🤍 ✅ ВК — 🤍 ✅ Telegram — 🤍 ✅ Чат Telegram — 🤍 Обучение Frontend-разработке — 🤍 Frontend Book PDF — 🤍 Задать вопрос про фронтенд или верстку — 🤍
Друзья, в видео расскажу о бэм нейминге, объясню принципы, которыми руководствовались ребята при создании данной методологии. Конечно же, теория это круто, но мы с вами пропишем бэм стили для целого лендоса, чтобы закрепить все на практике. Макет из урока: 🤍 Мой курс по верстке - 🤍 Урок по scss/sass: 🤍 Урок по Gulp: 🤍 Урок по Pug: 🤍 Подпишитесь на канал, если вам понравилось данное видео: 🤍
У даному уроці Ви дізнаєтеся про методологію БЕМ, завдяки якій ми навчимося правильно, а головне - логічно називати класи елементів. У кінці уроку ми з Вами на реальному макеті закріпимо знання, отримані під час цього уроку, склавши кілька екранів. Посилання на макет - 🤍 * Домашнє завдання - зверстайте та стилізуйте наступні 2 секції (після тих, які були зверстані в уроці) з макету. З питань менторства та перевірки домашніх завдань звертатися - 🤍 Telegram - канал для спілкування та допомоги в навчанні між учнями, які проходять цей онлайн-курс, а також для інформування про нові відеоуроки, які вийдуть найближчим часом - 🤍 . *
💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 18 Сентября 2023 года. ↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓ Макет в Telegram канале: 🤍 HTML верстка сайта лендинга. Урок для начинающих. Напишем HTML разметку, применим CSS стили с препроцессором SCSS, используем BEM naming. В этой части мы стартовали? написали сброс стилей, экспортировали всю графику, подключили шрифты. заверстали навигацию, шапку и 2 секции лендинга. Продолжим в следующей части. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 18 Сентября 2023 года 💻 Курс "JS Frontend разработчик": 🤍 Старт обучения: 23 Октября 2023 года 🏁 Обучение с нуля 💁♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: На канале ВебКадеми 🤍 вы найдете много полезных обучающих материалов, а так же сможете поработать со мной лично пройдя мои курсы. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Сайт: 🤍 Вконтакте: 🤍 Telegram канал: 🤍
Сверстаем главную страницу для интернет магазина в React JS. Адаптив, стили, анимации. Материалы будут опубликованы в Telegram канале: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "JS Frontend разработчик + React": 🤍 Обучение с наставником, 3 месяца, результат, гарантия. Старт курса: 23 Октября 2023 года 💻 Курс "Профессия HTML верстальщик": 🤍 Обучение с наставником, 3 месяца, результат, гарантия. Старт курса: 18 Сентября 2023 года 🏁 Обучение с нуля 💁♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Сайт школы ВебКадеми: 🤍 Вконтакте: 🤍 Telegram канал: 🤍 ТАЙМ КОДЫ: 00:00 Старт стрима 07:00 Настройка окружения 17:51 Старт работы. Обзор стартового проекта 25:30 Нарезка графики. Используем готовую 28:07 Шрифты. Fontfascia и Google Fonts 30:25 Общие CSS стили 32:50 Общение с чатом 35:37 Компонент для шапки 44:02 Общение с чатом 45:40 Верстка шапки 52:45 Логотип 55:53 CSS переменные 57:14 Навигация 1:04:13 Общение с чатом 1:07:34 Секция Promo 1:36:00 Курсы ВебКадеми 1:38:40 Общение с чатом 1:41:55 Секция Brands 1:52:30 Секция New Arrivals 2:00:25 Компонент Card 2:14:40 Анимация ховера по карточке 2:19:03 Props. Передача свойств в компоненты 2:24:50 Завершение стрима. Общение в чате
Поддержать автора: 🤍 Исходный код: 🤍 Макет: 🤍 Макет с исправлениями: 🤍 * Музыка: Glacier - Patrick Patrikios
Поддержать автора: 🤍 Исходный код: 🤍 Макет: 🤍 Макет с исправлениями: 🤍 * Музыка: 1. chill. by sakura Hz 🤍 Creative Commons — Attribution 3.0 Unported — CC BY 3.0 🤍 Music promoted by Audio Library 🤍 2. Glacier - Patrick Patrikios
💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 18 Сентября 2023 года. ↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓ Продолжаем практику HTML CSS верстки админ панели, личного кабинет крипто-кошелька. Верстаем на препроцессоре SASS/SCSS. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "Профессия HTML верстальщик": 🤍 Старт обучения: 18 Сентября 2023 года 💻 Курс "JS Frontend разработчик": 🤍 Старт обучения: 23 Октября 2023 года 🏁 Обучение с нуля 💁♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 📍 Материалы к уроку: • Макет урока: 🤍 • Первая часть: 🤍 • Готовый код с первой части: 🤍 • Готовый код второй части: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Меня зовут Юрий Ключевский. Я занимаюсь разработкой сайтов уже много лет, специализируюсь на front-end разработке и верстке сайтов, JavaScript и PHP программировании. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, Javascript, JQuery, PHP, MySQL, React, Gulp. На нашем канале 🤍 вы найдете много полезных обучающих материалов, а так же сможете поработать со мной лично пройдя мои курсы. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Сайт школы ВебКадеми: 🤍 Наша группа Вконтакте: 🤍 Telegram канал: 🤍
В этом видео мы поговорим про верстку сайта для начинающих. Очень важная тема так как я расскажу с чего начать в верстке сайта любому новичку. Верстка сайта только кажется сложной работой на первый взгляд, на самом деле дела обстоят не так. Верстку сайта может освоить совершенно любой человек, который даже никогда не был связан с программирование и html css. Все шаги поэтапно я описал в этом видео и рассказал как и где начать верстать. TemplateMonster - 🤍
Мы продолжаем уроки flexbox практика и в этом уроке flexbox css я покажу как сделать header и навигацию для сайта. Обратите внимание насколько быстро и легко получится сделать данный вариант навигации сайта да и вообще как сделать сайт с применение flexbox очень быстро и легко. ПОДПИШИСЬ на канал "Web Developer Blog" - 🤍 И не пропускай новые видео!!! ПЛЕЙ-ЛИСТЫ МОЕГО КАНАЛА: JavaScript практика - 🤍 Основы JavaScript - 🤍 Уроки Bootstrap 4 - 🤍 Уроки Framework для верстки Foundation 6 - 🤍 Рубрика "Основы за 10 минут" - 🤍 Верстка сайта на Foundation 6 - 🤍 Основы препроцессора SASS - 🤍 Уроки по Sublime text 3 - 🤍 Видео про заработок на YouTube - 🤍 Создаем интернет магазин на PrestaShop - 🤍 Уроки jQuery - 🤍 ПОДПИШИСЬ на Группу Вконтакте "Web Developer Blog" - 🤍
Всем привет, мы продолжаем уроки Flexbox практика и в этом уроке я покажу как сделать адаптивный шаблон сайта на flexbox своими руками и очень просто и быстро без использования каких либо фреймворков и сеток. Flexbox это уникальная система которая очень поможет вам в разработке сайтов ПОДПИШИСЬ на канал "Web Developer Blog" - 🤍 И не пропускай новые видео!!! ПЛЕЙ-ЛИСТЫ МОЕГО КАНАЛА: JavaScript практика - 🤍 Основы JavaScript - 🤍 Уроки Bootstrap 4 - 🤍 Уроки Framework для верстки Foundation 6 - 🤍 Рубрика "Основы за 10 минут" - 🤍 Верстка сайта на Foundation 6 - 🤍 Основы препроцессора SASS - 🤍 Уроки по Sublime text 3 - 🤍 Видео про заработок на YouTube - 🤍 Создаем интернет магазин на PrestaShop - 🤍 Уроки jQuery - 🤍 ПОДПИШИСЬ на Группу Вконтакте "Web Developer Blog" - 🤍
Чем отличается Отзывчивый сайт от Адаптивного? Как создаются сайты, которые работают на компьютерах, телефонах и планшетах? В этом уроке вы разберемся с принципами построения и создания адаптивности сайта. Исходные файлы: 🤍 Подписывайся на группы в социальных сетях: Вконтакте 🤍 Telegram 🤍 Понравилось видео? Подпишись 🤙 Поставь лайк 👍 Оставь комментарий 💬 И жди следующего урока) Если тебе надоело смотреть бесполезные курсы, которые не дают практических знаний. Хочешь стать полноценным Fullstack разработчиком в 2018 года - верстать сайты, создавать веб приложения и писать сервер? Делюсь собственным 5 летним опытов в программировании. Теги #адаптивная_верстка_сайта #адаптивный_сайт #bootstrap #cssgrid #flexbox #как_создать_сайт_за_час #как_создать_сайт #создание_сайта #html #css #html5 #css3 #js #javascript
.svg){kind=small}
![Tailwindcss верстка реального проекта 2023. Практика. [eng subs]](https://i.ytimg.com/vi/C4TQ_8au4K0/mqdefault.jpg "Tailwindcss верстка реального проекта 2023. Практика. [eng subs]")
