挪动端的一些基础知识

装备像素(物理像素): 能够认为是计算机坐标体系中的一个点,这个点代表一个能够由顺序运用的假造像素比,然后由相干体系转换为物理像素。

屏幕密度:是指一个装备表面上存在的像素数目
CSS像素:是一个笼统的单元,重要运用在浏览器上,用来准确器量Web页面上的内容,css像素称为与装备无关的像素
装备像素比(device pixel ratio):简称为dpr,定义了物理像素和装备自力像素的对应关联

装备像素比 = 物理像素 / 装备自力像素

在差别的屏幕上,css像素所显现的物理尺寸是一致的,在一般屏幕下1个css像素对应1个物理像素,而在Retina屏幕下,1个css像素对应的倒是4个物理像素。

在js中,用window.devicePixelRatio来猎取当前装备的dpr,在css中,能够经由过程-webkit-device-pixel-ratio,-webkit-min-device-pixel-ratio和 -webkit-max-device-pixel-ratio举行媒体查询,对差别dpr的装备,做一些款式适配(这里只针对webkit内核的浏览器和webview)。

iphone6装备宽度和高度为375 667,能够理解为装备的自力像素。他的dpr为2,所以他的物理像素为750pt1334pt

    原文作者:jyren_Rachel
    原文地址: https://segmentfault.com/a/1190000009335689
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞