前言

本文来自于对 http://bjango.com/articles/min-device-pixel-ratio/ 的部分整理:

正文

  • -webkit-min-device-pixel-ratio为1.0
  1. 所有非Retina的Mac
  2. 所有非Retina的iOS设备
  3. Acer Iconia A500
  4. Samsung Galaxy Tab 10.1
  5. Samsung Galaxy S
  • -webkit-min-device-pixel-ratio为1.3
  1. Google Nexus 7
  • -webkit-min-device-pixel-ratio为1.5
  1. Google Nexus S
  2. Samsung Galaxy S II
  3. HTC Desire
  4. HTC Desire HD
  5. HTC Incredible S
  6. HTC Velocity
  7. HTC Sensation
  • -webkit-min-device-pixel-ratio为2.0
  1. iPhone 4
  2. iPhone 4S
  3. iPhone 5
  4. iPad (3rd generation)
  5. iPad 4
  6. 所有Retina displays 的MAC
  7. Google Galaxy Nexus
  8. Google Nexus 4
  9. Google Nexus 10
  10. Samsung Galaxy S III
  11. Samsung Galaxy Note II
  12. Sony Xperia S
  13. HTC One X
 
 
 
.search{background:url(img/guide-search.jpg) no-repeat; height:415px;}
.attention{background:url(img/guide-attention.jpg) no-repeat; height:250px;}
.forward{background:url(img/guide-forward.jpg) no-repeat; height:486px;} /* 高清图 */
@media only screen and (-webkit-min-device-pixel-ratio:2){
.search{background:url(img/guide-search-2x.jpg) no-repeat;background-size:100%;}
.attention{background:url(img/guide-attention-2x.jpg) no-repeat;background-size:100%;}
.forward{background:url(img/guide-forward-2x.jpg) no-repeat;background-size:100%;}
}

  

高分辨率 2x图像: -webkit-min-device-pixel-ratio 的常见值对照的更多相关文章

  1. Device Pixel Ratio & Media Queries

    一些重要的名词解释: CSS pixels(CSS 像素):详见http://www.w3.org/TR/css3-values/#reference-pixe CSS声明的像素值,可随着放大缩小而放 ...

  2. 移动端 解决自适应 和 多种dpr (device pixel ratio) 的 [淘宝] 解决方案 lib-flexible

    其实H5适配的方案有很多种,网上有关于这方面的教程也非常的多. 不管哪种方法,都有其自己的优势和劣势. 为什么推荐使用Flexible库来做H5页面的终端设备适配呢?   原理  简单易懂  源码疑问 ...

  3. dpr——设备像素比(device pixel ratio)

    设备像素比 = 物理像素 / 逻辑像素 1.物理像素 显示器上最小的物理显示单元(像素颗粒),在操作系统的调度下,每一个设备像素都有自己的颜色值和亮度值. 例如:手机大小固定,物理像素越高,画面越清晰 ...

  4. [Canvas] Make Canvas Responsive to Pixel Ratio

    Canvas is great for high performance graphics rendering but by default the results look blocky on ph ...

  5. Java基于opencv实现图像数字识别(三)—灰度化和二值化

    Java基于opencv实现图像数字识别(三)-灰度化和二值化 一.灰度化 灰度化:在RGB模型中,如果R=G=B时,则彩色表示灰度颜色,其中R=G=B的值叫灰度值:因此,灰度图像每个像素点只需一个字 ...

  6. c#图像灰度化、灰度反转、二值化

    图像灰度化:将彩色图像转化成为灰度图像的过程成为图像的灰度化处理.彩色图像中的每个像素的颜色有R.G.B三个分量决定,而每个分量有255中值可取,这样一个像素点可以有1600多万(255*255*25 ...

  7. C# 图像快速转化成byte[]和计算像素值

    public static unsafe byte[] ConvertTo8Byte(Bitmap img) { byte[] result = new byte[img.Width * img.He ...

  8. [Tools] Create your own mobile emulator device by using Chrome dev tool

    Using the New Device Emulation Interface The Device Emulation interface changed a bit with the newer ...

  9. 移动端H5页面高清多屏适配方案

    背景 开发移动端H5页面 面对不同分辨率的手机 面对不同屏幕尺寸的手机 视觉稿 在前端开发之前,视觉MM会给我们一个psd文件,称之为视觉稿. 对于移动端开发而言,为了做到页面高清的效果,视觉稿的规范 ...

随机推荐

  1. 【英语】Bingo口语笔记(27) - 如何培养口语语感

  2. 【英语】Bingo口语笔记(30) - 表示“拒绝”

  3. 【Django】Python虚拟环境工具virtualenv

    教程 第一步:安装virtualenv $pip install virtualenv 第二步:开启虚拟环境的python $cd ENV/Scripts $activate.bat #启用virtu ...

  4. MySQL与Oracle 差异比较之七用户权限

    用户权限 编号 类别 ORACLE MYSQL 注释 1 创建用户 Create user user_name identified by user_password default tablespa ...

  5. webtest 文章

    一直也没有和游戏类测试打过交道,看到“腾讯WeTest ”提供的测试服务,以及和手机游戏相关的技术文章.在此作个备份记录的. 手游专题 http://wetest.qq.com/lab/tag/?ta ...

  6. HDU5804 Price List (BestCoder Round #86 A)水题

    分析:大于总和输出1 #include <cstdio> #include <cstring> #include <algorithm> using namespa ...

  7. Provider 错误 '80004005' 未指定的错误 的最终解决方法

    今天在配置公司的香港WEB服务器Server2003系统,建好应用程序池后,发现远行程序经常出现下面的错误,刷新几下又可以,但过不了多久又是出现下面的错误!! 在网上查找相关问题得知,这是2003SP ...

  8. LR之录制SQL脚本

    1.选择协议 ①MS SQL serve ②ODBC 一般情况下选ODBC 2.录制步骤

  9. Java之--Java基础知识

    一.软件基础知识 1.软件:一系列按特定顺序组织的计算机数据和指令的集合. 1)系统软件:DOS.windows.linux. 2)应用软件:QQ.扫雷等. 2.软件开发就是制作软件. 3.人与计算机 ...

  10. 【C#】用C#通过读取数据库方式读取CSV文件

    using System; using System.Collections.Generic; using System.Linq; using System.Windows.Forms; names ...