2014-04-24 13 views
0

나는 클라이언트 용 웹 사이트를 프로그래밍하고 이제는 스마트 폰 템플릿을 개발 중입니다. 스마트 폰과 태블릿을 분리하기 위해 미디어 쿼리로 max-device-width를 사용했습니다. Everythng은 정상적으로 작동하지만 iphone 4는 웹 사이트를 확대합니다. 뷰포트를 잘못 정의했거나 버그인지 잘 모르겠습니까? 웹 사이트는 다음과 같습니다 http://mksgmbh.com 은 내가 1로 초기 규모를 설정하려고 ios 4 웹 사이트에서 미디어 쿼리 또는 뷰포트 발행

<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, target-densityDpi=device-dpi' name='viewport' /> 
<meta name="viewport" content="width=device-width" /> 

뷰포트

다음 사용하지만, 너무 작업을 나던.

답변

1

사이트를 볼 때 여러 개의 뷰포트 태그가 있습니다. 당신은 최대-장치 폭을 사용하는 당신을,
또한

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0"> 

UPDATE 미디어 쿼리를, 예를 들면 : 그들 모두를 제거하고 중

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

또는 사용자 줌 않도록하려면로 대체하십시오

@media only screen and (max-device-width: 760px) { 
... 
} 

특정 장치를 대상으로하려고하지 않는 한, 당신은 같은 것이 아니다 및 반응 설계, 폭은 일반적으로 원하는 결과를 얻을 것이다 단지

@media only screen and (max-width: 760px) { 
... 
} 

장치의 폭과 너비를 시도 할 수 . This link has some more background info 차이에 대해

희망이 도움이되었습니다.

+0

약간 도움이되었지만 약간의 버그가 있습니다. initial-scale = 1.0은 완전히 맞지 않습니다. 안드로이드와 ios에서도 축소해야합니다. – bunower