css media запросы не работают при использовании PhoneGap - PullRequest
Новая
       1

css media запросы не работают при использовании PhoneGap

2 голосов
/ 26 декабря 2011

Я занимаюсь разработкой приложения для iPhone / iPad, используя PhoneGap и js / css3, и недавно начал использовать увеличенный размер экрана iPad, чтобы внести определенные изменения в свой макет. Я добавил раздел только для iPhone в моем CSS с

@media screen and (max-device-width: 480px) {

и раздел только для iPad с

@media screen and (min-device-width: 481px) {

и они, казалось, отлично работали на моем рабочем столе, когда я отлаживал (используя chrome, как в win и mac, так и в safari в mac). Когда я собрал свое приложение в xCode и запустил его на устройстве, кажется, что все правила в этих разделах полностью игнорируются, и моя компоновка неверна.

Есть какой-то трюк, который я должен использовать, чтобы заставить меня работать?

Ответы [ 2 ]

2 голосов
/ 13 марта 2012

Важно, чтобы вы добавили область просмотра в заголовок вашего HTML-документа: 

<html>
  <head>
    ...
    <meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;' name='viewport' />
    ...
  </head>
  <body>
    ...
  </body>
</html>

Также см .: Изменение ориентации медиазапроса CSS не работает PhoneGap

1 голос
/ 22 февраля 2012

Можете ли вы попробовать 

@media only screen and (-webkit-min-device-width: 481px) {

для вашего iPad только раздел и вернуться ко мне?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...