有些小伙伴們,在使用chrome的移動端調試工具調試網頁的時候,會發現iphone6上的尺寸為375*667,不禁差異,iphone6的分辨率不是750*1334嗎?
實際上調試器上的大小單位不是px,而是pt(point)
這就得說到物理分辨率與邏輯分辨率
物理分辨率:屏幕的實際大小,小伙伴們可以嘗試一下對iphone6的大小進行測量,大小為375px*667px,請注意分辨率的概念有許多種,這是指長度單位px,
為了不與分辨率相混淆,單位設為pt(實際上用px作為分辨率的單位是不合適的,極容易被初學者混淆,所以就本人而言,在表達分辨率時,不用px作為單位)
邏輯分辨率: 手機上1px與1px大小的區域,用屏幕上的顯示元件來顯示,會用到幾個?答案是1個、4個或9個,這因屏而定,而邏輯分辨率,指的就是這些最小的
顯示元件的數目。
總結如下:
物理分辨率
單位: pt point
意義: 屏幕大小
邏輯分辨率
意義:元件數目
日常盜圖
關於兩者之間的比例,可通過設備像素比,來獲取 window.devicePixelRatio
規律
1--4(4所有系列) 1
5--6(單指iphone6) 2 開始采用retina屏
6+ 3