Retina 顯示屏
Retina 直接翻譯是視網膜的意思。css
在IT上，是 Apple 公司提出的。web
retina 屏指得是那些在正常使用距離下人類沒法看見顆粒度得屏幕iphone
顆粒度就是這種東西翻譯
基本上只要點夠小夠密, 那麼就看不見顆粒度了code
iphone 的 dpi 是 320 以上. 屬於上 retina 屏幕.blog
咱們能夠經過 css media query 或者 js 來獲取 device 的 dpi ip
window.devicePixelRatio
單位是 1 = 96 dpi;io
Retina屏幕對web的影響class
在Retina屏幕下照片會base on 設備的 window.devicePixelRatio 而變大。im
好比一張 300px 的相片 , 在一架 devicePixelRatio = 2 的手機上
會是 600px 的！照片會被放大1倍也就懵掉了！
因此爲了迎合 Retina 手機，咱們必須具有 600px的照片和一張 300px的照片.
經過遊覽器 img 標籤的屬性 srcset="123_big.jpg 2x"
來自動判斷顯示哪一張圖像。