Запросы контейнеров CSS — это новая функция CSS, которая очень нравится веб-разработчикам. Это может спровоцировать революцию в веб-дизайне — от адаптивного дизайна на основе страниц к адаптивному дизайну на основе контейнеров.
Chrome DevTools поможет вам внедрить новые шаблоны проектирования макетов и оставаться в курсе последних тенденций. Благодаря поддержке этой функции CSS вы теперь можете проверять и отлаживать запросы к контейнерам в DevTools.
В видео выше представлен обзор запросов контейнеров, их синтаксиса и способов их проверки в DevTools.
Теперь вы можете обнаружить элементы контейнера и их потомков с помощью соответствующего значка, который включает наложение пунктирной линии.
Проверьте правила @container , применяемые к потомкам, когда контейнеры удовлетворяют условиям запроса.
Дополнительные сведения о поддержке контейнерных запросов в DevTools см. в разделе Проверка и отладка запросов контейнера CSS .