Разница между визуальным видовым окном и макетом просмотра?

Ответ 1

Визуальное окно просмотра - это часть страницы, отображаемой на экране.

Видовой экран макета может быть значительно шире, чем визуальный видовой экран, и содержит элементы, которые появляются и не отображаются на экране.

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

Для отличного рассмотрения проблемы см.: http://www.quirksmode.org/mobile/viewports2.html

Ответ 2

Очень хорошее объяснение двух найдено здесь.

Вкратце:

Визуальный видовой экран

Визуальное окно просмотра - это часть страницы, отображаемой на экране. Пользователь может прокрутить, чтобы изменить часть просматриваемой страницы, или увеличить, чтобы изменить размер визуального окна просмотра.

Макет окна просмотра

Однако макет CSS, особенно процентная ширина, вычисляется относительно окна просмотра макета, который значительно шире, чем визуальный видовой экран.

Таким образом, элемент сначала берет ширину окна просмотра макета, а ваш CSS интерпретируется так, как если бы экран был значительно шире экрана телефона. Это гарантирует, что макет ваших сайтов ведет себя так же, как в браузере рабочего стола.

Насколько широка область просмотра макета? Это зависит от браузера. Safari iPhone использует 980px, Opera 850px, Android WebKit 800px и IE 974px.

Короче говоря, окно просмотра макета, как правило, является шириной окна просмотра, когда экран масштабируется полностью.