在做一個wap網站時發現在 IPONE4頁面顯示寬高為320*480頁不是640*960了，這樣顯示就不全屏了，下面我來告訴你具體的解決辦法。

如果你也遇到了同樣的問題，想要快速的解決掉它。你可以試著將viewport設置或添加成如下CODE:

 代碼如下 復制代碼

<meta name="viewport" content="initial-scale=0.5,maximum-scale=0.5,minimum-scale=0.5" />

如果恰巧解決了這個問題，那麼恭喜你！

兩種：
1、縮放自適應
2、響應式布局

第一種，縮放自適應的頁面， 可以使用

 代碼如下 復制代碼

<!--最普通最常見的用法-->
<meta name="viewport" content="width=device-width" />
<!-- 如果有足夠的高清圖資源，主要支持retina設備(ip4/4s)，那麼推薦下面這種-->
<meta name="viewport" content="width=640" />
<!-- 如果針對new iPad，甚至可以試試這個-->
<meta name="viewport" content="width=1536" />

第二種，復雜的響應式布局，實際就是要求頁面在切換橫屏時不放大，從而留出空白用以填充或調整列布局。
此時可以看到無論width還是initial-scale都無法限制橫屏時的放大，因而必須用上minimum/maximum-scale,而width和initial-scale則推薦使用initial-scale，使三個scale參數統一。

 代碼如下 復制代碼

<!--最普通最常見的用法-->
<meta name="viewport" content="initial-scale=1,maximum-scale=1,minimum-scale=1" />
<!--for retina screen-->
<meta name="viewport" content="initial-scale=0.5,maximum-scale=0.5,minimum-scale=0.5" />

如果你在Android，或其它移動設備上也遇到了分辨率與頁面尺寸不符的情況，你也可以試著懷疑一下viewport。