1.dpr 移動(dòng)端設(shè)備像素比
設(shè)備像素比DPR(devicePixelRatio)是默認(rèn)縮放為100%的情況下西潘,設(shè)備像素和CSS像素的比值
DPR = 設(shè)備像素 / CSS像素(某一方向上)
實(shí)際上胆屿,CSS對(duì)應(yīng)的js屬性是screen.width/height嗤练,DPR對(duì)應(yīng)的是window.devicePixelRatio.
以iphone5為例继控,iphone5的CSS像素為320px*568px,DPR是2央渣,所以其設(shè)備像素為640px*1136px.
2.meta標(biāo)簽的viewport屬性
https://segmentfault.com/a/1190000009448193
多數(shù)移動(dòng)應(yīng)用將viewport設(shè)置為不可縮放來保證頁面的顯示
3.移動(dòng)頁面配適
大漠大大的博客:
https://www.w3cplus.com/css/vw-for-layout.html
這張圖太棒了吧...
各種頁面高度
vw是基于viewport視窗的長度茫打,這里的視窗(Viewport)指的就是瀏覽器可視化的區(qū)域居触,而這個(gè)可視區(qū)域是window.innerWidth/window.innerHeight
的大小