Мета-тег с именем viewport используется для определения масштабирования и отображения веб-страницы на мобильных устройствах. Этот мета-тег является необязательным, но рекомендуется к использованию, чтобы обеспечить оптимальное отображение веб-страниц на различных устройствах.

Синтаксис мета-тега viewport выглядит так:

<meta name="viewport" content="значение" />

Значение атрибута content может содержать несколько параметров, которые определяют, как будет масштабироваться и отображаться страница на устройствах:

1. width: Определяет ширину веб-страницы. Значение может быть числом, которое указывает точную ширину, или словом device-width, чтобы страница занимала всю ширину экрана устройства.
2. initial-scale: Определяет начальный масштаб страницы. Значение может быть числом от 0 до 10.
3. minimum-scale: Определяет минимальный масштаб страницы. Значение может быть числом от 0 до 10.
4. maximum-scale: Определяет максимальный масштаб страницы. Значение может быть числом от 0 до 10.
5. user-scalable: Определяет, разрешено ли пользователю масштабировать страницу. Значение может быть yes (разрешено) или no (запрещено).

Например, чтобы создать масштабируемую страницу, которая занимает всю ширину экрана устройства и разрешает пользователю масштабировать страницу, можно использовать следующий мета-тег:

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />

Этот мета-тег указывает браузеру, что страница должна быть масштабирована таким образом, чтобы занимать всю ширину экрана устройства, начальный масштаб должен быть равен 1,0 и пользователю разрешено масштабировать страницу.

Назад