CSS中的px与屏幕分辨率的关系

  • CSS中的px称为逻辑像素 :也叫设备独立像素(Device Independent Pixel, DIP),可以理解为反映在CSS代码里的像素点数。
  • 屏幕的分辨率是物理像素:设备屏幕实际拥有的像素点。比如iPhone 6的屏幕在宽度方向有750个像素点,高度方向有1334个像素点,所以iPhone 6总共有750*1334个物理像素。

两者之间是通过一个DPR来联系的,DPR = 物理像素 / 逻辑像素

需要注意的是在浏览器调试页手机选项中显示的是手机的逻辑像素。
iphone 6/7/8的的物理像素1334*750,dpr为2 ,所以逻辑像素为667*375,如图:


原文地址:https://blog.csdn.net/qq_23947467/article/details/86658490

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。