问题点1：iphone5分辨率：640 * 1136 dp，为什么chrome浏览器F12中显示的320 *568？？
        iPhone5 分辨率640 * 1136指的是物理像素，而实际开发中用的px是逻辑像素，
  • px : 逻辑像素，浏览器使用的抽象单位（抽象单位指根据不同设备可以变大变小）
  • dp, dt： 物理像素，与设备无关（物理像素是固定的不会改变）
  • dpr：像素比
  • ppI越高，像素越高，图像越清晰，系统默认设置缩放比越大
  • 视网膜Retina屏: dpr>=2
计算公式：1px = dpr^2 * dp 
 
 iphone5的dpr=2 即 1px = 4 * dp (x轴2个，y轴2个)
因此，640dp * 1136dp = 320px * 568px
 
问题点2：为什么iphone5的dpr等于2 ？
知识点：PPI 
计算公式：PPI = （1136^2 + 640^2）/4=326ppi (视网膜Retina屏)，根据ppi缩放比图，326属于超高dpi，所以默认缩放比为2 即dpr=2

完整换算流程如图：

Hello，移动WEB—px,dp,dpr像素基础的更多相关文章

  1. px,dp sp是像素、尺寸、尺寸

    px:即像素,1px代表屏幕上一个物理的像素点:px单位不被建议使用,因为同样100px的图片,在不同手机上显示的实际大小可能不同,如下图所示(图片来自android developer guide, ...

  2. 在Android中，px,dp,dip,sp的不同之处

           最近在学习Android开发,一直没有弄清楚px,dp,dip,sp的区别.今天正好有时间,就花时间研究了一下.     众所周知,Android厂商非常多,各种尺寸的Android手机 ...

  3. px,dp,dip,sp,in,mm,pt详细分析

    px,dp,dip,sp,in,mm,pt详细分析 px   :(pixels),屏幕的像素点,不同的设备显示效果相同,一般我们HVGA代表320x480像素,这个用的比较多. dip  :(devi ...

  4. pt和px区别 pt是逻辑像素，px是物理像素

    pt和px区别 pt是逻辑像素,px是物理像素字体大小的设置单位,常用的有2种:px.pt.这两个有什么区别呢?先搞清基本概念:px就是表示pixel,像素,是屏幕上显示数据的最基本的点:pt就是po ...

  5. 产品设计教程：如何理解 px,dp,dpi, pt，看这一篇就够了

    先聊聊熟悉的几个单位 围绕着各种屏幕做设计和开发的人会碰到下面几个单位:in, pt, px, dpi,dip/dp, sp 下面先简单回顾下前四个单位: “in” inches的缩写,英寸.就是屏幕 ...

  6. Android屏幕尺寸与度量单位(px,dp,sp)简介

    MarkdownPad Document *:first-child { margin-top: 0 !important; } body>*:last-child { margin-botto ...

  7. Python开发【第二十一篇】：Web框架之Django【基础】

    Python开发[第二十一篇]:Web框架之Django[基础]   猛击这里:http://www.cnblogs.com/wupeiqi/articles/5237704.html Python之 ...

  8. 移动像素的px ,dp/pt,dpr的关系

    一:基础知识 px:逻辑像素,浏览器使用的抽象单位 dp,pt:设备无关像素 也叫物理像素 dpr:devicePixelRatio 设备像素缩放比 计算公式:1px=(dpr)^2*dp; ipho ...

  9. 移动端web之像素基础

    px:css pixels逻辑像素,浏览器使用的抽象单位 dp,pt :device independent pixels 设备无关像素 dpr:devicePixelRatio 设备像素缩放比 计算 ...

随机推荐

  1. 又到圣诞节，让你的网页下起雪(js特效)

    又到圣诞节,让你的网页下起雪(js特效) 在4年多前,我写过一个特效,就是让你的网页下起雨,它的效果就是在你打开的网站,雨点下满你的屏幕,恩,大概效果如下图: 当然这个效果还有一些附带项,比如风速.风 ...

  2. Android StickHeaderRecyclerView - 让recyclerview头部固定

    介绍在项目中有时会需要recyclerview滑动式时某个view滑出后会固定在头部显示,比较常用的比如手机联系人界面.地区选择界面等. StickHeaderRecyclerView就是实现这个功能 ...

  3. jmeter简单录制

    JMeter介绍 1.JMeter,一个100%的纯Java桌面应用,它是Apache组织的开放源代码项目,它是功能和性能测试的工具.JMeter可以用于测试静态或者动态资源的性能(文件.Servle ...

  4. C# 轻松读取、改变文件的创建、修改、访问时间 z

    // 读取文件的创建.修改.访问时间FileInfo fi = new FileInfo("C://test.txt");Console.WriteLine(fi.Creation ...

  5. TP5.0：引入view视图中公共的模版文件

    1.实例:如后台admin模块,公用一个header.html和footer.hml 2.目录结构: 3.视图页面的使用方式: <!--添加header页面数据-->{include fi ...

  6. C/C++中构造函数和析构函数能否被继承

    http://bbs.csdn.net/topics/390160673 标准方面做了要求的.Even though destructors are not inherited 构造函数和析构函数是不 ...

  7. leetcode 322零钱兑换

    You are given coins of different denominations and a total amount of money amount. Write a function ...

  8. 泛型约束－swift

    1.泛型定义本体有参量类型约束: 2.泛型扩展对参量类型约束: 3.函数参量约束: 泛型类型的访问控制: 1.与类型无关的通用函数,泛型的任何实例都可以访问: 2.与类型有关的函数(通过扩展约束实现) ...

  9. Python语言程序设计基础（2）—— Python程序实例解析

    温度转换 def tempConvert(ValueStr): if ValueStr[-1] in ['F','f']: ans = (eval(ValueStr[0:-1]) - 32)/1.8 ...

  10. Codeforces 385C 线性筛素数

    题意:给定一个数组,求[l,r] 区间,区间里的素数,数组中,能被这个素数整除的个数,再求和. 分析:区间很大,10^9了,找去区间内的素数是不可能的,但是,数组的数很小,而且要能整除区间内的素数,所 ...