Ширина устройства отображения Retina не подгоняется автоматически на iPad при использовании ширины устройства

В настоящее время я работаю над веб-сайтом, где я использовал Retina Ready Coding. Дисплей Retina (новый iPad) имеет разрешение 2048 x 1536 пикселей, в то время как обычный iPad/Tab имеет разрешение 1024x768 пикселей. Согласно закону Retina, всякий раз, когда я использовал ширину тела / ширину контейнера 1536 пикселей в

@media only screen and (min-device-width: 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2) { body{ width: 1536px !important; }, .container{ width: 1536px !important; } }.

Это должно автоматически подогнать ширину: 1536 пикселей к 768 пикселям (как его соотношение пикселей-2). Но он показывает масштабирование всего сайта в iPad. Всякий раз, когда я прикасаюсь к iPad, он вписывается в ширину 768 пикселей из 1536 пикселей. У кого-нибудь есть решение для этого? Я столкнулся с той же проблемой для мобильного устройства с дисплеем Retina.


person engr. Kamal    schedule 19.09.2016    source источник
comment
@ Adrian, я уже использовал это окно просмотра. ‹meta name=viewport content=width=device-width, initial-scale=1, max-scale=1›   -  person engr. Kamal    schedule 19.09.2016


Ответы (2)


Вы установили область просмотра с помощью метатегов? это поведение выглядит так, как будто метатег области просмотра отсутствует. Попробуйте изменить/добавить настройки области просмотра с помощью этого метатега:

<meta name="viewport" content="width=device-width">

или это:

<meta name="viewport" content="initial-scale=1.0">

или оба:

<meta name="viewport" content="width=device-width, initial-scale=1">

также проверьте эту ссылку для пояснений

person Adrian Lambertz    schedule 19.09.2016
comment
как вы вообще знаете, использует ли OP метатег? не предполагайте ничего, когда отвечаете - person dippas; 19.09.2016
comment
@ Адриан, я уже использовал это окно просмотра. ‹метаимя=содержимое области просмотра=ширина=ширина устройства, начальный масштаб=1, максимальный масштаб=1› - person engr. Kamal; 19.09.2016

Проблема решена !!!

Я должен использовать этот метатег

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

Спасибо,

person engr. Kamal    schedule 20.09.2016