Retina 顯示屏

Retina 直接翻譯是視網膜的意思。

在IT上，是 Apple 公司提出的。

retina 屏指得是那些在正常使用距離下人類沒法看見顆粒度得屏幕

顆粒度就是這種東西

基本上只要點夠小夠密, 那麼就看不見顆粒度了

iphone 的 dpi 是 320 以上. 屬於上 retina 屏幕.

咱們能夠經過 css media query 或者 js 來獲取 device 的 dpi 

window.devicePixelRatio 

單位是 1 = 96 dpi;

Retina屏幕對web的影響

在Retina屏幕下照片會base on 設備的 window.devicePixelRatio 而變大。

好比一張 300px 的相片 , 在一架 devicePixelRatio = 2 的手機上 

會是 600px 的！照片會被放大1倍也就懵掉了！

因此爲了迎合 Retina 手機，咱們必須具有 600px的照片和一張 300px的照片.

經過遊覽器 img 標籤的屬性 srcset="123_big.jpg 2x" 

來自動判斷顯示哪一張圖像。