對於viewport的理解

 

 

 

剛看到viewport的時候, 各類搜索,各類概念, 看得頭大. 各類博客 / 文檔看過來,整理下本身心得, 但願能夠幫助須要的童鞋. (本文是本身的理解, 只對於移動端來講)編程

好多博客有介紹n種視口,n種像素.準確的概念我也記不住.  我只說下對dpr的理解.佈局

 

dpr = 設備物理像素 / 設備的邏輯分辨率.(不知道dpr的本身百度一下)spa

 

設備物理像素是多少 : 就是屏幕的分辨率. 好比 :1334*750scala

設備邏輯分辨率是什麼 : 理解這個概念以前先要理解設備獨立像素.ip

設備獨立像素(也稱密度無關像素,dips) : 是一個定義的固定長度的單位.不一樣的設備1dips是同樣的. 文檔

邏輯分辨率 就是屏幕的寬高以dips爲單位表示. 好比: 667*375 .博客

 

經過設置元信息:
 <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">.
這樣,佈局視口(layoutviewport)= 設備邏輯分辨率.
這時編程中的1px就等於1dips. 
 
假設當dpr=2時,  那麼編程中的1px, 在屏幕中顯示就是2px.
相關文章
相關標籤/搜索