问题点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. 关于easyui 窗口位置的调整

    (一)easyui 默认的窗口位置 浏览器中间 (二)可直接在style里进行更改 <div id="news_dialog" class="easyui-wind ...

  2. pl/sql实现金额转换为大写

    FUNCTION upper_case_currency(vrmb char) RETURN varchar2 IS rmbwodecimal varchar2(20); result varchar ...

  3. IntelliJ、ReSharper 6折 加入慧都“惊喜惠”

    慧都2013岁末回馈惊喜不断!著名的软件开发公司JetBrains旗下所有产品加入"惊喜惠"活动环节, JAVA IDE——IntelliJ IDEA,.NET效率工具集——ReS ...

  4. WebLogic配置与部署

    一.创建域: 第一步,选择“开始菜单”-> “Oracle WebLogic”-> “WebLogic Server 10gR3” -> “Tools”-> “Configur ...

  5. PrintDocument打印、预览、打印机设置和打印属性的方法（较完整） .

    private void Form1_Load(object sender, System.EventArgs e) { //获取或设置一个值,该值指示是否发送到文件或端口 printDocument ...

  6. 在同一网关下ping不通其他电脑

    最近在做数据库相关的程序,所以想先用ping试下和主机连没连着,但发现虽然两台电脑在同一网关下,但却互相ping不通,后来才发现,原来是防火墙在作怪. Omg!感慨一下!默认的情况下,保守的windo ...

  7. 删除所有正在运行和退出的docker实例

    docker ps -a能显示所有docker实例的状态,包含已经退出了的: 加上-q参数,只显示container id 使用这个命令,把docker ps -aq产生的输入作为输入传入到docke ...

  8. php多进程写入文件

    测试一 $begin = time(); for ($i=0; $i<10000; $i++) { $fp = fopen("tmp", 'r+'); fseek($fp, ...

  9. websocket常见错误

    当websockt连接是open的时候send()方法传送数据,当连接关闭或获取不到的时候回抛出异常. 一个通常的错误是人们喜欢在连接open之前发送消息.如下所示: // 这将不会工作 var ws ...

  10. 线程pthread_cleanup_push的简单例程.

    http://www.cnblogs.com/hnrainll/archive/2011/04/20/2022149.html #include<stdlib.h> #include< ...