safari 在 iPad Portrait 模式默認設置980px寬度

最近在作網站兼容性時發現 safari 在 iPad Portrait 模式，默認爲html、body標籤設置了980px寬度，致使頁面被縱向截斷，解決方法爲在頁面head區插入如下代碼便可完美解決。

<meta content="width=1210, initial-scale=0.5,target-densitydpi=300;" name="viewport"/>

width
控制 viewport 的大小，能夠指定的一個值或者特殊的值，如 device-width 爲設備的寬度（單位爲縮放爲 100% 時的 CSS 的像素）。

 

initial-scale
初始縮放。即頁面初始縮放程度。這是一個浮點值，是頁面大小的一個乘數。例如，若是你設置初始縮放爲「1.0」，那麼，web頁面在展示的時候就會以target density分辨率的1:1來展示。若是你設置爲「2.0」，那麼這個頁面就會放大爲2倍。

 

target-densitydpi
一個屏幕像素密度是由屏幕分辨率決定的，一般定義爲每英寸點的數量（dpi）。Android支持三種屏幕像素密度：低像素密度，中像素密度，高像素密度。一個低像素密度的屏幕每英寸上的像素點更少，而一個高像素密度的屏幕每英寸上的像素點更多。Android Browser和WebView默認屏幕爲中像素密度。