Тёмный

CSS3 #22 Медиазапросы (Media queries) 

webDev
Подписаться 117 тыс.
Просмотров 34 тыс.
50% 1

#YauhenK #webDev #CSS #CSS3
Всех приветствую в курсе «CSS3».
В данном видеокурсе мы с вами рассмотрим CSS, или каскадных таблиц стилей. Начнём с основ: простые и составные селектора, псевдоклассы и псевдоэлементы, позиционирование, блочная модель и т.д. А так же разберём свойства добавленные в третьей версии спецификации: границы и скругления, тени, градиенты, фильтры, трансформации, анимации, плавные переходы и т.д. По окончанию курса вы получите отличную теоретическую базу для создания полноценных статичных веб-страниц.
✒ Репозиторий курса:
✔ github.com/YauhenKavalchuk/css3
✒ Полный список готовых и планируемых курсов:
✔ Trello: trello.com/b/R6rD7qq8
✒ Автор курса:
✔ RU-vid: / yauhenkavalchuk
✔ Instagram: / yauhenkavalchuk
✔ Twitter: / yauhenkavalchuk
✔ VK: YauhenKavalchuk
✔ LinkedIn: / yauhenkavalchuk
✔ GitHub: github.com/YauhenKavalchuk
✔ VK (Группа): webdevcom
✒ Поддержать развитие канала: github.com/YauhenKavalchuk/yo...

Опубликовано:

 

8 фев 2021

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 55   
@jeanjean4001
@jeanjean4001 2 года назад
Все четко и по делу. Речь хорошая, приятно слушать. Спасибо автору!
@YauhenKavalchuk
@YauhenKavalchuk 2 года назад
Спасибо большое)
@vadimv3198
@vadimv3198 2 года назад
Очень понятно и доступно, как всегда. Спасибо за вашу работу!
@YauhenKavalchuk
@YauhenKavalchuk 2 года назад
Спасибо за отзыв)
@romko-romario
@romko-romario 2 года назад
Благодарю! Лучшее видео по теме: просто, доступно, исчерпывающе. Лайк и подписка!
@YauhenKavalchuk
@YauhenKavalchuk 2 года назад
Спасибо за отзыв
@velessn
@velessn 3 года назад
Спасибо Женя. Как всегда информативно.
@YauhenKavalchuk
@YauhenKavalchuk 3 года назад
Пожалуйста)
@nouchance
@nouchance 3 года назад
@@YauhenKavalchuk спасибо большое
@easycad6998
@easycad6998 11 месяцев назад
Бальзам для ушей коротко и ясно....Спасибо
@YauhenKavalchuk
@YauhenKavalchuk 11 месяцев назад
Всегда пожалуйста
@user-zw9mp2fd7d
@user-zw9mp2fd7d Год назад
Спасибо тебе друг, так понятно объясняешь!
@YauhenKavalchuk
@YauhenKavalchuk Год назад
Пожалуйста
@TheDazzlingLady
@TheDazzlingLady Год назад
Очень понятно и доходчиво. Спасибо!
@YauhenKavalchuk
@YauhenKavalchuk Год назад
Пожалуйста
@iamsabrina2375
@iamsabrina2375 Год назад
кратко и ясно, спасибо БОЛЬШОЕ ИМЕННО ЭТО Я И ИСКАЛА!!
@YauhenKavalchuk
@YauhenKavalchuk Год назад
Пожалуйста
@kipitok3181
@kipitok3181 11 месяцев назад
всё очень ясно и понятно, подобные ролики мотивируют, спасибо большое
@YauhenKavalchuk
@YauhenKavalchuk 11 месяцев назад
Всегда пожалуйста
@deli7055
@deli7055 6 месяцев назад
Спасибо, все коротко и по делу, автору развития канала и удачи
@YauhenKavalchuk
@YauhenKavalchuk 6 месяцев назад
Спасибо за отзыв
@SlavikDoroshenko
@SlavikDoroshenko Год назад
Как всегда полезно!
@YauhenKavalchuk
@YauhenKavalchuk Год назад
👍
@user-vv6jx8qg4v
@user-vv6jx8qg4v 3 года назад
Жека как всегда Крутой!
@YauhenKavalchuk
@YauhenKavalchuk 3 года назад
Спасибо!
@user-cw9ev9dq4v
@user-cw9ev9dq4v 2 года назад
интересно было бы увидеть полезные медиазапросы, которые часто на работе применяют
@YauhenKavalchuk
@YauhenKavalchuk 2 года назад
По сути, самые часто используемые это медиазапросы min-width и max-width. Все остальные - это специфичные случаи для решения узких задач
@user-cw9ev9dq4v
@user-cw9ev9dq4v 2 года назад
@@YauhenKavalchuk спасибо
@My-video123
@My-video123 3 года назад
Спасибо.
@YauhenKavalchuk
@YauhenKavalchuk 3 года назад
Пожалуйста
@SerhiiNesterov
@SerhiiNesterov Год назад
Спасибо
@YauhenKavalchuk
@YauhenKavalchuk Год назад
Пожалуйста
@vladgalekas
@vladgalekas Год назад
Евгений, почему на 3:10 в первом примере (да и во втором тоже) между двумя условиями (screen и (min-width: 320px)) отсутствует какой-либо оператор? И почему, при этом, в третьем примере оператор есть между всеми условиями?
@user-uy3sl7zc5o
@user-uy3sl7zc5o 4 месяца назад
почему при изменении min-width например на 980 px минимальный диапазон перестает работать
@mikevazowski6491
@mikevazowski6491 2 года назад
Merci beaucoup, лайк за объяснение
@YauhenKavalchuk
@YauhenKavalchuk 2 года назад
👍
@donstacky
@donstacky Год назад
Спасибо за урок! Я правильно понимаю, что поменять цвет фона страницы или хотя бы отдельного элемента при печати (в окне предварительного просмотра) не получится?
@donstacky
@donstacky Год назад
Разобрался) Оказывается нужно просто включить печать фоновых цветов и изображений в настройках браузера 😀
@YauhenKavalchuk
@YauhenKavalchuk Год назад
👍
@HA_CTPIME
@HA_CTPIME Год назад
👍👍👍
@YauhenKavalchuk
@YauhenKavalchuk Год назад
👍
@JustLeoWotPlay
@JustLeoWotPlay 3 года назад
Спасибо) только ratio читается по другому - "рейшио".
@YauhenKavalchuk
@YauhenKavalchuk 3 года назад
Учту)
@xxxxx-iy1lc
@xxxxx-iy1lc 2 года назад
как убрать в media "br" , но при этом, чтобы в некоторых моментах он был в тексте ? а то он убирается по всему тексту
@YauhenKavalchuk
@YauhenKavalchuk 2 года назад
Не понял вопроса(
@SunRam_
@SunRam_ Год назад
Привет я начинающий в том деле, сделал сайт через HTML and CSS, но вот остановился на адаптивности медиа запроса,это когда сайт делаешь размер до ноутбука,планшета и телефона сайт становится ужасным и все элементы расходятся, хотя в других видео там меняют некоторые стили чтобы под любые устройства адаптировался размер экрана
@YauhenKavalchuk
@YauhenKavalchuk Год назад
🤔
@tofutureguest
@tofutureguest Год назад
Указывайте width/height в процентах, никогда не используйте пиксели.
@alekhandro6303
@alekhandro6303 5 месяцев назад
​@@tofutureguest Небольшое уточнение: не только в процентах, лучше использовать разные относительные единицы в зависимости от задачи (%, vm, vh, em, ex и т.д.)
@sergiivishtak5934
@sergiivishtak5934 Год назад
Очень хорший урок. Хотелось бы узнать сколько требуется медиа запросов, чтобы зделать хороший адаптивный сайт?
@YauhenKavalchuk
@YauhenKavalchuk Год назад
Я не могу ответить на этот вопрос. Это зависит от того сколько у вас элементов, как они располагаются и сколько перестроений планируется
@user-ju3sc2ik5v
@user-ju3sc2ik5v Год назад
То есть что есть у тебя якобы на сайте ты должен всех по одному адаптировать под нужные разрешения экрана? Ну это кнопки , ссылки, текст, фото и т.д ?
@YauhenKavalchuk
@YauhenKavalchuk Год назад
Да
@ulbolsynzh
@ulbolsynzh Год назад
как в рем и ем и в % адаптацию делать?)
@YauhenKavalchuk
@YauhenKavalchuk Год назад
адаптивность для шрифтов делается следующим образом: 1. на все размеры шаблона устанавливаются относительные единицы 2. на body устанавливается абсолютный размер 3. при изменении размера экрана изменять размер только на body Таким образом, благодаря относительным единицам размер будет достаточно менять только в одном месте
Далее
skibidi cat pedro 🐈🔥  #skibiditoilet
00:20
Просмотров 1,6 млн
Как работают CSS Container Queries ?
11:09
Просмотров 3,8 тыс.