Лучшее руководство по Адаптивный веб-дизайн - Viewport в 2024 году. В этом руководстве вы можете изучить Что такое Viewport?,Установка Viewport,

Адаптивный веб-дизайн - Viewport

Что такое Viewport?

видовых пользовательские страницы видимой области.

видовой экран можно перевести на китайский язык под названием "просмотра."

Мобильный браузер страница в виртуальном окне "" (окна просмотра), как правило, это виртуальное "окно" (окно просмотра) шире, чем экран, так что вы не должны сжать каждой странице небольшое окно (это будет никаких повреждений макета оптимизирован для страницы мобильного браузера), пользователь может панорамирования и масштабирования для просмотра различных частей страницы.


Установка Viewport

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

  • ширина: контролировать размер окна просмотра, значение может быть задано, если 600, или специальное значение, такие как устройства ширины ширины устройства (в пикселях CSS масштабируется до 100% времени).
  • высота: ширина и соответствует заданной высоте.
  • Первоначальный масштаб: начальный масштаб, то есть, когда в первый раз масштаб загрузки страницы.
  • Максимальный масштаб: позволяет пользователю, чтобы увеличить до максимального коэффициента.
  • Минимальное значение шкалы: Позволяет пользователю масштабировать минимальный масштаб.
  • пользователь масштабируемые: может ли пользователь может вручную увеличить.

Следующий пример демонстрирует использование окна просмотра, используя окно просмотра, а не на мобильных побочных эффектов:

Пример 1 не было добавлено окно просмотра: Нажмите для просмотра

Пример 2, добавить видовой экран: Нажмите , чтобы посмотреть

Если вы посещаете на планшете или телефоне, вы можете нажать на, чтобы увидеть эффект.