This page was translated from English by the community. Learn more and join the MDN Web Docs community.

@viewport

Устарело

Эта возможность была удалена из веб-стандартов. Хотя некоторые браузеры по-прежнему могут поддерживать её, она находится в процессе удаления. Не используйте её ни в старых, ни в новых проектах. Страницы или веб-приложения, использующие её, могут в любой момент сломаться.

Кратко

@viewport CSS at-rule содержит набор вложенных дескрипторов в блоке CSS, который разделён фигурными скобками. Эти дескрипторы управляют настройками видового экрана, в первую очередь на мобильных устройствах.

Синтаксис

Коэффициент масштабирования, равный 1,0 или 100%, соответствует отсутствию масштабирования. Увеличьте масштаб больших значений. Меньшие значения уменьшаются

Дескриптор

Браузеры должны игнорировать непризнанные дескрипторы.

min-width
Используется при определении ширины видового экрана при первом отображении документа.
max-width
Используется при определении ширины видового экрана при первом отображении документа.
width
Сокращённый дескриптор для установки как минимальной ширины(min-width), так и максимальной ширины(max-width).
min-height
Используется при определении высоты видового экрана при первом отображении документа.
max-height
Используется при определении высоты видового экрана при первом отображении документа.
height
Сокращённый дескриптор для установки как минимальной высоты(min-height), так и максимальной высоты(max-height).
zoom
Устанавливает начальный коэффициент масштабирования.
min-zoom
Устанавливает минимальный коэффициент масштабирования.
max-zoom
Устанавливает максимальный коэффициент масштабирования.
user-zoom
Управляет тем, должен ли пользователь иметь возможность изменять коэффициент масштабирования.
orientation
Управляет ориентацией документа.

Формальный синтаксис

@viewport {
  <group-rule-body>
}

Пример:

@viewport {
  min-width: 640px;
  max-width: 800px;
}
@viewport {
  zoom: 0.75;
  min-zoom: 0.5;
  max-zoom: 0.9;
}
@viewport {
  orientation: landscape;
}

Спецификация:

Спецификация Статус Комментарий
CSS Device Adaptation
Определение '@viewport' в этой спецификации.		 Рабочий черновик Initial definition

Совместимость с браузерами:

BCD tables only load in the browser

Смотреть также