웹 사이트를 iPhone의 너비로 확장하는 방법은 무엇입니까?

저는 1920x1080px에 (8x240 픽셀) 열을 표시하는 액체 레이아웃 웹 사이트를 가지고 있습니다. 그들 사이에는 공백이 없습니다. 나는 위의 코드에서 다른 설정을 시도웹 사이트를 iPhone의 너비로 확장하는 방법은 무엇입니까?

<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=yes,width=960" > 
<meta name="viewport" content="width=device-width; height=device-height;">

하지만 아무리 내가 아이폰 2G와 4S에 무엇을 항상 (4 × 240 픽셀) 컬럼 (480 × 320 픽셀 및 960x640px 해상도)를 표시하지 : 나는 HEAD이 추가되었습니다.

첫 번째 열에는 텍스트가 들어 있기 때문에 3 열 또는 2 열을 표시하고 싶지만 지금은 거의 읽을 수 없습니다.

iPhone에서 너비를 2로 나누고 싶습니다. 어떻게 할 수 있습니까?

내 웹 사이트는 480x320px의 브라우저를 만들 때 iPhone (480x320px)과 바탕 화면에 다르게 표시됩니다. 왜 그런가요?

출처

2012-03-14 Atadj

당신이 찾고있는 것을 반응 형 웹 디자인이라고합니다. http://en.wikipedia.org/wiki/Responsive_Web_Design – Stefan

맞습니다.하지만 위의 해결책이 효과가없는 이유는 내 질문에 대한 답변이 아닙니다. 링크 주셔서 감사합니다! – Atadj

좋아, '메타 뷰포트'에 대한 두 개의 훌륭한 링크가있다. https://developer.mozilla.org/en/Mobile/Viewport_meta_tag 및 http://www.quirksmode.org/blog/archives/2010/09/combining_meta.html – Stefan

는 내가 전에 meta viewport을 사용 haven't하지만 두 번 설정하는 이상한 것 같다, 왜 다른 하나의 쉼표 ,에서 사용 세미콜론 ;?

이것은 나에게 더 옳은 것처럼 보이지만 나는 그것을 테스트하지 않았다.

<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1,maximum-scale=1,user-scalable=yes,width=960" />

희망 하시겠습니까?

출처

2012-03-14 12:23:40 Stefan

초기 규모 : 1 :)없이 작동하지만 너비를 800으로 설정했습니다. – Atadj

jquery를 사용하여 화면 크기에 따라 뷰포트 설정을 전환하는 것이 가장 좋은 방법입니다.

if($(window).width() >= 768) { 
    // Change viewport for smaller devices 
    $('meta[name=viewport]').attr('content','width=959'); 
}

출처

2014-08-02 21:12:13 Kinoli

웹 사이트를 iPhone의 너비로 확장하는 방법은 무엇입니까?

답변

관련 문제