Основные параметры, которые учитываются в медиа-запросах для адаптивного дизайна:
- Ширина и высота экрана. 12 Для этого используются условия max-width (применяет стили, если ширина экрана меньше или равна заданному значению) и min-width (применяет стили, если ширина экрана больше или равна заданному значению). 1
- Ориентация устройства. 1 Можно применять стили в зависимости от ориентации устройства (portrait — портретная, landscape — альбомная). 1
- Разрешение. 12 Позволяет учитывать плотность пикселей дисплея (например, для Retina-экранов). 2
Также в медиа-запросах указывается тип устройства (опционально) — определяет, для каких устройств применяются стили (например, screen или print). 2 Если тип не указан, запрос будет применяться ко всем устройствам. 2