首先呢，我們將iPhone手機的相關數據表示如下
我們要理解很多東西，比如邏輯分辨率、物理分辨率、縮放因子、ppi等，這里先不討論。
首先呢，我們先介紹下各個屏幕寬度：
網頁可見區域寬： document.body.clientWidth
網頁可見區域高： document.body.clientHeight
網頁可見區域寬： document.body.offsetWidth (包括邊線的寬)
網頁可見區域高： document.body.offsetHeight (包括邊線的高)
網頁正文全文寬： document.body.scrollWidth
網頁正文全文高： document.body.scrollHeight
網頁被卷去的高： document.body.scrollTop
網頁被卷去的左： document.body.scrollLeft
網頁正文部分上： window.screenTop
網頁正文部分左： window.screenLeft
屏幕物理分辨率的高： window.screen.height
屏幕物理分辨率的寬： window.screen.width
屏幕可用工作區高度： window.screen.availHeight
屏幕可用工作區寬度： window.screen.availWidth
屏幕縮放因子：window.devicePixelRatio
屏幕邏輯分辨率：window.screen.width * window.devicePixelRatio (縮放因子與物理分辨率的乘積)
下面，我將分別在不同設備上的演示后的結果截圖如下：
iPhone5
iPhone6
iPad
PC
那么大家根據這些，多理解理解這些數據。
我們在移動端開發時，在<head>標簽中加入
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
這句話幫我們解決了很多問題，我們只要按照設備物理像素的大小來進行開發就行了。