Retina 直接翻译是视网膜的意思。
在IT上,是Apple 公司提出的。
意思是指一个显示屏的颗粒度 px 密度高到人类无法看见。
要了解细节必须先了解基础知识
inch 英寸 1 inch = 2.52 cm
手机的inch 以屏幕的斜线(左上角到右下角的长度)来计算
ppi = pixel per inch 就是1 inch 里面有多少个像素,也可以当成密度来看待 。
所以 ppi 越高越好.
Retina屏幕对web的影响
在Retina屏幕下照片会base on 设备的 window.devicePixelRatio 而变大。
比如一张 300px 的相片 , 在一架 devicePixelRatio =2 的手机上 
会是 600px 的!照片会被放大1倍也就懵掉了!
所以为了迎合 Retina 手机,我们必须具备 600px的照片和一张 300px的照片.
通过游览器 img 标签的属性 srcset="123_big.jpg 2x" 
来自动判断显示哪一张图像。

Retina 显示屏的更多相关文章

  1. 让你的应用支持新iPad的Retina显示屏

    一.应用图片标准iOS控件里的图片资源,苹果已经做了相应的升级,我们需要操心的是应用自己的图片资源.就像当初为了支持iPhone 4而制作的@2x高分辨率版本(译者:以下简称高分)图片一样,我们要为i ...

  2. Retina显示屏-揭秘移动端的视觉稿通常会设计为传统PC的2倍

    一.Retina显示屏简介 retina:一种具备超高像素密度的液晶屏,同样大小的屏幕上显示的像素点由1个变为多个,如在同样带下的屏幕上,苹果设备的retina显示屏中,像素点1个变为4个. reti ...

  3. RETINA显示屏下ICON优化方法

    便于理解,先来了解几个名词: dpi(dots per inch),每英寸的点数,用来测量任何设备的硬件分辨率.一个21”的屏幕可以拥有1680 X 1050 的分辨率,27”的屏幕也可以拥有相同的分 ...

  4. Retina时代的前端视觉优化

    随着New iPad的发布,平板也将逐渐进入Retina时代,在高分辨率设备里图片的显示效果通常不尽人意,为了达到最佳的显示效果就需要对图片进行优化,这里介绍一些优化方法: 一.用CSS替代图片 这一 ...

  5. IOS 特定于设备的开发:监测Retina支持

    近年来,Apple在其旗舰设备上引入了Retina显示屏.根据Apple的说法,他的像素密度非常高,足以使人眼无法区分单独的像素. UIScreen类提供了一种容易的方式,用于监查当前设备是否提供了内 ...

  6. 移动端,多屏幕尺寸高清屏retina屏适配的解决方案

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

  7. 【转】Retina 屏幕下,网页图片的显示兼容

    感谢 Apple,带来了 Retina 屏幕的革命,让我们可以在电子显示屏上享受到印刷级的分辨率.由于分辨率的提升,网页中的文字.Flash 和 SVG 内容显示得比原来更加精细,但网页中的图片却变得 ...

  8. 解读AppIcon图标设置置信息和App内存警告临界值

    前面有同学问到了iOS内存警告临界值和工程项目里AppIcon的一些配置信息,相信对刚入行的同学来说,可能都会碰到类似的问题,记录一下供后来者查询. 1.先简单说下AppIcon的图标的配置信息 1) ...

  9. 【原】移动web资源整理

    2013年初接触移动端,简单做下总结,首先了解下移动web带来的问题 设备更新换代快——低端机遗留下问题.高端机带来新挑战 浏览器厂商不统一——兼容问题多 网络更复杂——弱网络,页面打开慢 低端机性能 ...

随机推荐

  1. cloudCompute

    云计算使企业可以迅速对市场做出反应而且加强了企业内部的协同 人人都在用云计算的时候能够迅速迁移到云平台已经不叫优势了,反而不使用云计算成为了一种劣势

  2. DataGuard体系结构

    一.DataGuard总体结构 总体目标 1.   描述计划和非计划停机的不同因数 2.   DataGuard的主要组件 3.   物理以及逻辑DataGuard的异同 4.   建立DataGua ...

  3. JSP导出Excel文件

    和普通的查询数据差别是没有分页,response设置一下就是到处功能. window.location.href="${_base}/promoteConsume/exportExcel?& ...

  4. atitit.提升研发效率的利器---重型框架与类库的差别与设计原则

    atitit.提升研发效率的利器---重型框架与类库的差别与设计原则 1. 框架的意义---设计的复用 1 1.1. 重型框架就是it界的重武器. 1 2. 框架 VS. 库 可视化图形化 1 2.1 ...

  5. Robotium -- AndroidUI优化工具HierarchyViewer

    为什么使用HierarchyViewer 不合理的布局会使我们的应用程序UI性能变慢,HierarchyViewer能够可视化的角度直观地获得UI布局设计结构和各种属性的信息,帮助我们优化布局设计.H ...

  6. juce: 跨平台的C++用户界面库

    如果你用过QT和MFC,那你必然知道QT是基于C++的跨平台库,而MFC是微软针对widows平台推出来基础类库.且不论MFC的设计如何,从我个人和身边朋友的经历来看,MFC是一些非常难以理解的类的组 ...

  7. Target runtime Apache Tomcat v6.0 is not defined. phyy Unknown Faceted Project Problem

    Description Resource Path Location TypeTarget runtime Apache Tomcat v6.0 is not defined. phyy Unknow ...

  8. ulimit -n修改单进程可打开最大文件数目

    对所有用户都生效: vi /etc/profile 添加一行如下: ulimit -n 65535 执行source /etc/profile生效,不需要重启服务器. $ source /etc/pr ...

  9. 【网络流#9】POJ 2135 Farm Tour 最小费用流 - 《挑战程序设计竞赛》例题

    [题意]给出一张无向图,从1开始到n,求两条没有公共边的最短路,使得路程总和最小 每条边的权值设为费用,最大流量设为1,然后就是从源点到汇点流量为2的最小费用流. 因为是规定了流量,新建一个源点和一个 ...

  10. HDU -1864最大报销额(01背包)

    这道题属于简单的01背包,但是背包问题还算简单,就是前面的细节处理的时候要注意,题意大致说了三条限制吧 1. 只有a, b, c 三种类型的发票可以报销,其它的一律不报销 2. 物品单项的报销额不超过 ...