Хватит использовать медиазапросы! Попробуйте этот современный CSS

В этом видео вы шаг за шагом изучите CSS-запросы @container и поймете, чем они отличаются от традиционных медиа-запросов. В отличие от медиа-запросов, которые зависят от размера области просмотра, запросы контейнеров позволяют компонентам реагировать на размер родительского контейнера, что делает макеты по-настоящему адаптивными, многоразовыми и масштабируемыми. Вы узнаете: ✓ Что такое CSS-запросы контейнеров и почему они важны ✓ Как запросы контейнеров заменяют медиа-запросы для компонентов ✓ Использование container-name для выбора конкретных контейнеров ✓ Написание нескольких запросов контейнеров на одной странице ✓ Использование логических операторов внутри @container ✓ Единицы измерения длины запроса контейнера (cqw, cqh, cqi, cqb, cqmin, cqmax) ✓ Как текст и макет реагируют на ширину и высоту контейнера К концу этого видео вы сможете создавать современные адаптивные макеты, которые подстраиваются под размер компонента, а не под размер экрана — используя чистый CSS. -------------------------- ⏱️ Таймлайн 00:00 – Введение 00:18 – Медиа-запросы против контейнерных запросов 00:45 – Использование container-type: inline-size 02:26 – container-type: size против inline-size 03:11 – Использование container-name для нескольких карточек 05:21 – Единицы измерения длины контейнерного запроса (cqw, cqh, cqi) -------------------------- Не забудьте поставить лайк, подписаться и оставить комментарий, если это помогло вам понять контейнерные запросы 💚 Скоро появятся новые уроки по современному CSS!