Логотип YeaHub

База вопросов

Собеседования

Тренажёр

База ресурсов

Обучение

Навыки

Войти

Выбери, каким будет IT завтра — вместе c нами!

YeaHub — это полностью открытый проект, призванный объединить и улучшить IT-сферу. Наш исходный код доступен для просмотра на GitHub. Дизайн проекта также открыт для ознакомления в Figma.

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про CSS: media, features

Какие параметры можно проверять в media queries?

Вопрос проверяет знание параметров среды отображения, которые доступны для проверки в media queries.

Короткий ответ

В media queries можно проверять размеры экрана, ориентацию и плотность пикселей.
Также можно учитывать тип устройства и пользовательские настройки.
Эти параметры используются для точной адаптации интерфейса.
Чаще всего проверяется ширина viewport.

Длинный ответ

Media queries позволяют реагировать не только на размер экрана, но и на другие характеристики устройства.

Основные параметры media queries

На практике чаще всего используются следующие параметры:

  1. Размеры экрана

    • width, height

    • min-width, max-width

  2. Ориентация устройства

    • orientation: portrait

    • orientation: landscape

  3. Тип устройства

    • screen

    • print

  4. Плотность пикселей

    • resolution

    • device-pixel-ratio

  5. Возможности ввода

    • hover

    • pointer

Пример

@media (min-width: 1024px) and (hover: hover) {
  .menu {
    display: block;
  }
}

Вывод

Media queries позволяют адаптировать интерфейс не только под размеры экрана, но и под реальные возможности устройства, что делает верстку более гибкой.

Уровень

  • Рейтинг:

    4

  • Сложность:

    5

Навыки

  • CSS

    CSS

Ключевые слова

#media

#features

Подпишись на React Developer в телеграм