首页 > 代码库 > Retina 显示屏

Retina 显示屏

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" 
来自动判断显示哪一张图像。