Viewport — это видимая область веб-страницы в браузере. Он определяет размеры и масштаб содержимого, отображаемого пользователю. Без него страницы могли бы некорректно отображаться на разных устройствах, от десктопов до смартфонов.
Основное его назначение — адаптация макета страницы под размеры экрана устройства. С помощью мета-тега viewport можно контролировать ширину и масштабирование контента.
html
width=device-width: Устанавливает ширину окна просмотра равной ширине экрана устройства.initial-scale=1.0: Задает начальный уровень масштабирования при загрузке страницы. Единица означает отсутствие масштабирования (100%).Использование viewport тесно связано с технологиями адаптивного дизайна, такими как медиа-запросы CSS, которые позволяют применять разные стили в зависимости от размеров окна просмотра.