При использовании ширины устройства ширина дисплея 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">

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

Другие вопросы по тегам