При использовании ширины устройства ширина дисплея Retina не автоматически устанавливается на iPa d
В настоящее время я работаю на сайте, где я использовал Retina Ready Coding. Дисплей Retina (новый iPad) имеет разрешение 2048 x 1536 пикселей, в то время как обычный iPad/Tab имеет разрешение 1024x768 пикселей. Согласно закону Retina, всякий раз, когда я использовал ширину тела / ширину контейнера 1536px в
@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; } }.
Это должно автоматически установить ширину:1536px в 768px(как его отношение пикселей-2). Но он показал, что зоомин весь сайт в iPad. Всякий раз, когда я касаюсь iPad, он умещается в 768px с шириной 1536px. У кого-нибудь есть решение для этого? Я сталкиваюсь с той же проблемой для дисплея Retina Mobile.
2 ответа
Проблема решена!!!
Я должен использовать эту мета тег
<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=1" />
Спасибо,
Вы установили область просмотра, используя метатеги? Такое поведение выглядит так, как будто нет метатега области просмотра. Попробуйте изменить / добавить настройки области просмотра с этим метатегом:
<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">
также проверьте эту ссылку для объяснений