Медиа-запросы в CSS — это инструмент для создания адаптивного дизайна веб-страницы. Они позволяют настраивать стили для разных устройств и экранов в зависимости от их размеров, разрешения и других параметров. В CSS3 медиа-запросы были добавлены для поддержки мобильных и планшетных устройств.
Синтаксис медиа-запроса начинается с ключевого слова @media, за которым следует условие, задающее определенные характеристики устройства. Затем идут стили, которые применяются, если условие медиа-запроса соответствует устройству.
Пример медиа-запроса, который применяет стили для устройств с шириной экрана меньше 768 пикселей:
@media (max-width: 767px) {
/* стили для мобильных устройств */
}Медиа-запросы позволяют создавать адаптивный дизайн, позволяя странице адаптироваться к различным устройствам и размерам экранов. Некоторые характеристики устройств, которые могут использоваться в медиа-запросах, включают в себя ширину и высоту экрана, разрешение экрана, ориентацию экрана и многое другое.
