PhoneGap을 사용하는 동안 CSS 미디어 쿼리가 작동하지 않습니다.

PhoneGap 및 js/css3을 사용하여 iPhone/iPad 앱을 개발하고 있으며 최근에 iPad의 더 큰 화면 크기를 사용하여 레이아웃을 구체적으로 조정하기 시작했습니다. 사용 ( 나는PhoneGap을 사용하는 동안 CSS 미디어 쿼리가 작동하지 않습니다.

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

와

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

및 아이 패드 전용 섹션 내 CSS에서 아이폰 전용 섹션을 추가하고 내가 디버깅 할 때 그들은 내 바탕 화면에 잘 작동하는 것 같았다 크롬, win과 mac 모두에서, safari는 Mac에서). xcode에서 응용 프로그램을 빌드하고 장치에서 실행하면 해당 섹션 내의 모든 규칙이 완전히 무시되고 레이아웃이 모두 잘못된 것처럼 보입니다.

나를 위해이 일을하기 위해 사용해야 할 트릭이 있습니까?

출처

2011-12-26 Noam Gal

당신은 당신의 아이 패드 전용 섹션

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

을 시도하고 나에게 다시받을 수 있나요?

출처

2012-02-22 15:36:22

당신이 당신의 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 Media Query Orientation Change not working PhoneGap

출처

2012-03-13 13:58:46

PhoneGap을 사용하는 동안 CSS 미디어 쿼리가 작동하지 않습니다.

답변

관련 문제