px:css pixels逻辑像素，浏览器使用的抽象单位

dp,pt :device independent pixels 设备无关像素

dpr:devicePixelRatio 设备像素缩放比

计算公式：1px=(dpr)2 * dp

iphone 5 的dpr等于2

因此：平面上 1px=4*dp  640dp*1136dp

　　　纬度上 1px=2*dp  320px*568px

DPI:打印机每英寸可以喷的墨汁点

PPI：屏幕每英寸的像素数量，即单位英寸内的像素密度

在计算机显示设备参数描述上，二者意思表达的是一样

计算公式：以iphone5为例

ppi=√（11362+6402）/4=326ppi(视网膜Retina屏) 注意：单位为硬件像素，非px


ppi越高，像素数越高，图像越清晰

但可视度越低（小），系统默认设置缩放比越大

移动端web之像素基础的更多相关文章

  1. 移动端web开发基础概念

    最近在了解移动端web开发的相关知识,有些概念总是模糊不清,这次花费了一些时间整体的梳理了一遍. 分辨率 分辨率可以从显示分辨率与图像分辨率两个方向来分类.显示分辨率(屏幕分辨率)是屏幕图像的精密度, ...

  2. web端 第一天认识基础

    .NET 分为两大类 一.客户端应用程序   C/S 技术: Winform WPF MFC   MVVM 二.外部端应用程序  B/S(网页端应用程序/WEB端/WEB端应用程序) 目前学的技术是A ...

  3. 【超级干货】手机移动端WEB资源整合

    meta基础知识 H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 <meta name="viewport" content="width=device-wid ...

  4. 手机移动端WEB资源整合

    meta基础知识 H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 <meta name="viewport" content="width=device-wid ...

  5. 移动端web开发进阶

    三个月前曾写过一篇跨终端响应式页面设计入门的博客,上了博客园头条也得到了不少关注,今天想在这篇博客的基础上,继续写一篇进阶的文章. 补充 基于“入门”一文,我想再补充几个基础知识点,主要都是针对iOS ...

  6. 【超级干货】手机移动端WEB资源整合：转载

    转载于:http://www.w3cfuns.com/notes/24611/fbba9cbd616e795360ea45515494aa53.html meta基础知识 H5页面窗口自动调整到设备宽 ...

  7. Web开发——HTML基础

    文档资料参考: 参考:MDN官网 参考:http://www.runoob.com,W3School 参考:https://developer.mozilla.org/zh-CN/docs/Learn ...

  8. 移动端web开发技巧（转）

    原文链接:http://liujinkai.com/2015/06/06/mobile-web-skill/ 移动端web开发技巧 这是一个最好的时代,因为我们站在潮流中:但也是一个最坏的时代,因为我 ...

  9. 【饿了么】—— Vue2.0高仿饿了么核心模块&移动端Web App项目爬坑（三）

    前言:接着上一篇项目总结,这一篇是学习过程记录的最后一篇,这里会梳理:评论组件.商家组件.优化.打包.相关资料链接.项目github地址:https://github.com/66Web/ljq_el ...

随机推荐

  1. openssl 证书操作命令

    生成Self Signed证书 # 生成一个key,你的私钥,openssl会提示你输入一个密码,可以输入,也可以不输, # 输入的话,以后每次使用这个key的时候都要输入密码,安全起见,还是应该有一 ...

  2. zjuoj 3607 Lazier Salesgirl

    http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3607 Lazier Salesgirl Time Limit: 2 Sec ...

  3. this 的工作原理

    JavaScript 有一套完全不同于其它语言的对 this 的处理机制. 在五种不同的情况下 ,this 指向的各不相同. 全局范围内 this; 当在全部范围内使用 this,它将会指向全局对象. ...

  4. Java：String和Date、Timestamp之间的转

    Java:String和Date.Timestamp之间的转 一.String与Date(java.util.Date)互转 1.1 String -> Date String dateStr  ...

  5. js日期选择控件

    // 日期选择 // By Ziyue(http://www.web-v.com/) // 使用方法: // <script type="text/javascript" s ...

  6. 两个img之间出现间隙的解决方法

    今天写了个小页面,发现了一个问题,两个包在a标签里的img之间总是有间隙,不能挨在一起,最后在同事的帮助下,找到解决的办法是,设置img的基线,css代码如下: img{vertical-align: ...

  7. 【Linux命令与工具】磁盘与目录的容量——df和du

    df(disk free):列出文件系统的整体磁盘使用量 用法: df [-akmhi] [目录或文件名] 参数: -a: 列出所有的文件系统,包括系统特有的/proc等文件系统 -k: 以KB的容量 ...

  8. 皇后(queen)

    皇后(queen)[题目描述] 众所不知,rly现在不会玩国际象棋.但是,作为一个OIer,rly当然做过八皇后问题.这里再啰嗦几句,皇后可以攻击到同行同列同对角线,在n*n的方格中摆n个皇后使其互不 ...

  9. Argument list too long......

    作为一名运维人员来说,这个错误并不陌生,在执行rm.cp.mv等命令时,如果要操作的文件数很多,可能会使用通配符批量处理大量文件,这时就可能会出现“Argument list too long”这个问 ...

  10. Oracle简单的函数语言

    函数:这里的函数相当于java中写好的一些方法,有名字,可以传递参数,实现某一项具体功能. 函数分为: 1.单行函数 1.字符函数 2.日期函数 3.数字函数 4.转换函数 2.分组函数(后面的章节再 ...