Верстка сайта онлайн. Подробно с объяснениями для новичков. HTML, CSS, JS
ฝัง
- เผยแพร่เมื่อ 23 ก.พ. 2023
- Верстаю макет в прямом эфире. Макет и материалы к уроку: t.me/+9XtDDNBdHAk4Yjhi
Адаптивная мобильная верстка HTML CSS JS из Figma. FlexBox, формы.
Верстка главной страницы туристического сайта.
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Бесплатный курс "Создай свой первый сайт на HTML5 и CSS3"
7 уроков по 30 мин: webcademy.ru/htmlsite/
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Курс по созданию и верстке сайтов: webcademy.ru/htmlstart/
Обучение с наставником, 3 месяца, результат, гарантия.
Научим создавать веб-сайты и зарабатывать на этом.
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Курс "Frontend разработчик. JavaScript + React": webcademy.ru/jscourse/
Обучение с наставником, 3 месяца, результат, гарантия.
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
🏁 Обучение с нуля
💁♂️ Обучение с наставником
🎯 Доведение с нуля до результата
🏢 Помощь с трудоустройством
💵 Поможем взять первый заказ на фрилансе
Сайт: webcademy.ru/
Вконтакте: webcademy
Telegram канал: t.me/webcademynews
Я еще не доросла, чтобы просто, посмотрев макет в Figme, вытянуть из него все детальки, всю подноготную и самостоятельно сверстать сайт. Но мой аскетизм я оправдываю так: -ведь это удел продвинутых.
Но, есть у нас хороший учитель, который помогает найти этот путь, ведущий к росту. Юрий, я даже не знаю, каким мерилом мерить этот, Ваш, волшебный дар -«деланье». Спасибо.
Юрий, спасибо за труды! Очень все нравится! Буду учиться дальше😊😊😊
Спасибо за Ваши уроки, легко и очень интересно объясняете!
очень приятный человек с очень понятным объяснением
спасибо Юрий отличная работа все круто учусь по вашим стримам.
Юрий, это была замечательная трансляция. Огромное Вам спасибо! К сожалению, возможность оставить комментарий под ней появилась лишь спустя пару-тройку дней. Думаю, именно поэтому, при большом количестве лайков, коментариев не так много. Вы создали отличную авторскую методику преподавания. По вашей трансляции можно как идти по шагам, ставя на паузы и повторяя всё руками, т.о. тренироваться в канве реального производственного процесса, а можно, обладая базовыми HTML/CSS знаниями, посмотреть всеь спектакль целиком, на одном дыхании, и получить объемное представление о "кухне" современного верстальщика. Понравилось всё и особенно Ваша спокойная, дружелюбная манера вести урок по сложному материалу, при этом всё строить вживую, прямо на глазах. Нет никакой воды. Обязательно познакомлюсь с Вашими уроками по другим темам. Не бросайте, пожалуйста, это дело, у Вас дар. Материалов подобного качества на Ютубе не так много. Было очень интересно.
Сергей, спасибо большое за комментарий и слова благодарности, очень приятно и вдохновляет на новые крутые уроки!)
Шикарное видео
Стрим полезный и информативный, единственный нюанс не вижу комментариев, которые вы читаете))
Здравствуйте, хотел бы у вас уточнить, почему у меня не срабатывает opacity: 1; ?
В видео тайминг 47:25
а где 2 часть? Ну там где адаптив верстается
Спасибо за стрим!!!
Подскажите какой у вас шрифт в VS Code?
Consolas
256 лайк мой. 256 )))))
ю. ю ю б.ю. ю. ю .юю. ю. . ю. . 😅😢😅😅😅😅😅😮😅😅😅😅😮😅😅😮😅😅😅😅😅😅😅😅😅😅😅😮😅😅😅
😅э. ю ююю ююю....б. .ю. б ...ю.. . ю . . юююю юю.ю.юююю ю ю ю....😅😮😅😢😅😅😅😅😅😅😅😅
А где ссылка на файл с css стилями?
Спасибо большое за видео!
Люди, подскажите, переключение между окнами с помощью Ctrl+Win лево/право? На 41:01. Просто анимация плавная на видео. А у меня нет...
Или это специальная утилита?
Так у него же Mac
Это на маке так. Переключение между фулл скринами свайпом на трекпаде. Кстати очень удобно
@Артемий круто. Я на маке работаю. :)
@@bakhodirbadalov6713 трекпад удобней мышки?
@@AntonioBenderas если привикнеш то вообще классная вещь. Чисто для работы. Не для игр. С жестами много что можно упростить
Юрий, подскажите, пожалуйста, как поступить, если на странице нужны несколько контейнеров с разными широтами, как их именовать, согласно БЭМу? Я ломаю голову вокруг вариантов container container--width-1200 и header-container (если контейнер нужен для хеадера). Какая практика самая частая, или как делаете лично вы?
И моя большая благодарность за труды. Учусь, глядя на вашу работу.
Добрый день.
Можно делать через модификаторы .container.container--wide
Можно просто как дополнительный варианты контейнера как вы описали: .container, .container-wide, .container-footer
@@WebCademy Спасибо вам ещё раз!
Привет, подскажите, какая тема у вас в VS CODE?
ayu
@@Hakanai2022Спасибо
302 второй мой лайк
Добрый день. Подскажите пожалуйста а где взять макет. По ссылке в ТГ нету его.
Смотрите посты за 23 марта 23 года
t.me/c/1579074518/132
покажи как картинку разрезать на части и натянуть на любой сайт
В figma есть инструмент slice для разрезки картинки на части.
😡Почему нельзя сделать чтобы по ссылке открывался именно тот материал который нужно? Зачем делать так чтобы полчаса нужно было лазить по телеграм?
Чтобы получить хоть какую то выгоду
Не могу продублировать себе макет. Ломается. Показывает только header и в кашу.
Скачайте локально. File - Save as .Fig