前言

本文来自于对 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. POJ2236 Wireless Network

    解题思路:简单并查集,注意时间限制是10000MS,每次进行O操作之后,   进行一次for循环,进行相关调整.同时注意输入输出格式,见代码: #include<cstdio> #incl ...

  2. UML时序图

    时序图定义 : 描述了对象之间传递消息的时间顺序, 用来表示用例中的行为顺序, 是强调消息时间顺序的交互图; 时序图描述的事物: 时序图描述系统中类和类之间的交互, 将这些交互建模成消息交换, 时序图 ...

  3. NetBeans-xdebug的安装

    如果总是提示正在连接,ok,应该是没有装xdebug; 1,下载Php版本对应的xdebug.dll文件,以下是官方提供的网址,可以智能判断环境,给出下载链接和使用指南 http://www.xdeb ...

  4. 剑指offer—算法之位运算(二进制中1的个数)

    位运算: 左移:m<<n将m左移n位,左移后低位补充0: 右移:m>>n将m右移n位,右移后高位补充的是符号位,负数补充1,整数补充0.(正数的边界值为(1,ox7FFFFFF ...

  5. JSP的九个隐式(内置)对象

    1.out 转译后对应JspWriter对象,其内部关联一个PrintWriter对象.是向客户端输出内容常用的对象. 2.request 转译后对应HttpServletRequest对象.客户端的 ...

  6. JSONP实例

    JSONP实例 package sus.app; import java.io.IOException; import java.util.Map; import javax.servlet.http ...

  7. 虚拟机VMware tools作用以及其安装

    虚拟机VMware tools的作用(1). 更新虚拟机中的显卡驱动, 使虚拟机中的XWindows可以运行在SVGA模式下.在客户操作系统中安装Mware Tools非常重要.如果不安装VMware ...

  8. SPF详解2

    什么是SPF?   这里的SPF不是防晒指数,而是指Sender Policy Framework.翻译过来就是发信者策略架构,比较拗口,通常都直接称为SPF.   SPF是跟DNS相关的一项技术,它 ...

  9. hdu 5253 最小生成树

    赤裸裸最小生成树,没啥说的,我用kruskal过的 /* * Author : ben */ #include <cstdio> #include <cstdlib> #inc ...

  10. selenium python (十四)上传文件的处理

    #!/usr/bin/python# -*- coding: utf-8 -*-__author__ = 'zuoanvip' #上传过程一般要打开一个系统的windows窗口,从窗口选择本地文件添加 ...