Всегда ли ширина устройства ipad 3 равна 768, даже если в метатеге области просмотра ширина разрешения равна 1536?
Я пытаюсь понять метатег viewport для устройств ios. Я создал тестовую страницу, куда я вставил изображение шириной 862 пикселя. поэтому у меня есть метатег viewport как:
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale: .5, maximum-scale: 5.0">
Тем не менее, на ipad 3 с шириной разрешения 1536 пикселей и установленным для окна просмотра того же размера видимой области ipad 3 изображение размером 862 пикселей увеличивается, и его ширина немного больше, чем у видимой области. поэтому я должен прокрутить горизонтально, чтобы увидеть остальную часть изображения.
Это заставляет меня думать, что device-width возвращает 768 пикселей, и это объясняет немного больше горизонтальной прокрутки для изображения 862 пикселей. Почему он это делает? Есть ли какая-то плотность пикселей, которую я должен учитывать?
ОБНОВИТЬ
Я попытался установить ширину в числовую ширину, точно такую же ширину изображения (в данном случае "862"). Таким образом, веб-страница 862X206, такая же, как изображение, но она делает то же самое, что и установка ширины на ширину устройства.
ОБНОВЛЕНИЕ 2
Я создал очень простую страницу, и по какой-то причине пустая страница с окном просмотра 862 пикселей вызывает горизонтальную и вертикальную прокрутку на моем ipad 3, код:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=862, initial-scale=1.0">
</head>
<body style="width:100%; padding:0; margin:0">
</body>
</html>
Эта прокрутка приводит к тому, что область просмотра не помещается в видимую область или размер экрана. Я не понимаю Любое понимание будет с благодарностью. Спасибо. ** Примечание ** Я забыл добавить сброс отступа и поля к 0, это было добавление 8 пикселей поля.
ОБНОВЛЕНИЕ 3
Хорошо, изначально я думал, что device-width вернет разрешение 1536 пикселей ipad 3. По-видимому, он возвращает размер экрана 768 пикселей.
Любая ширина области просмотра больше, чем 768, дает мне прокрутку на Ipad 3. почему? Что делать, если у вас была страница размером 1024 пикселя, и вы хотите разместить ее в видимой области ipad 3. Если вы установите ширину 1024, начальный масштаб - 1, разве это не приведет к тому, что область просмотра 1024 пикселей вписывается в видимая область?
РЕШЕНИЕ
Итак, если вы хотите, чтобы каждое устройство выяснило, как масштабировать вашу страницу, все, что вам нужно сделать, это опустить начальное масштабирование.
Поэтому, если я установлю только ширину, используя либо значение ширины устройства, либо числовое значение, и опущу начальный масштаб, он автоматически рассчитает масштаб для вас. и это просто работает.
моя путаница заключалась в том, что означает ширина, ширина означает ширину до применения масштаба, поэтому если я скажу:
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale: .5, maximum-scale: 5.0">
ширина области просмотра до масштаба равна 768, и если тело веб-страницы имеет значение 862px, а после применения коэффициента масштабирования 1,0, содержимое умножается на 1,0, 862*1,0, поэтому ширина области просмотра теперь равна ширина содержимого, масштабируемая с таким масштабным коэффициентом, составляет 862 пикселя. Я надеюсь, что понимаю это право. вот где мое замешательство было, что означало ширина.
1 ответ
IPad 3 имеет ширину 768 пикселей, где каждый пиксель представляет 2 физических пикселя. Вы можете учесть это в Javascript, но не в своем окне просмотра, насколько я знаю (и вы, вероятно, не хотите, так как эти 768 пикселей имеют тот же физический размер, что и на предыдущих iPad).