處理視網膜顯示的最佳方式是什麼？

可能重複：
How do I set retina graphics for my website?處理視網膜顯示的最佳方式是什麼？

什麼是增加2倍圖像將與視網膜圖形顯示在新的iPad網頁的最佳方法是什麼？

我已經閱讀了這些文章。

http://www.kylejlarson.com/blog/2012/creating-retina-images-for-your-website/

http://www.teamdf.com/web/automatically-serve-retina-artwork/191/

http://retinajs.com/

來源

2012-11-07 Daljit

「最佳」是什麼意思？這些文章中的任何解決方案有沒有特別的問題？ – deceze

我只是研究視網膜顯示器的工作原理，並尋找處理這些顯示器中圖像的最佳方法。我敢肯定，這是新的發展需要。 – Daljit

SVG精靈。完成。 – cimmanon

有用於解決Retina顯示屏（大型顯示屏等）的各種問題建議的方法很不幸，大多數的這些只是，建議。

兩種最流行的是增加一個標記，它接受多個圖像和瀏覽器將只加載一個（取決於由開發者指定的媒體的查詢）的建議：

<picture alt="angry pirate"> 
    <source src=hires.png media="min-width:800px"> 
    <source src=midres.png media="min-width:480px"> 
    <source src=lores.png> 
     <!-- fallback for browsers without support --> 
     <img src=midres.png alt="angry pirate"> 
</picture>

另一建議是指定對於圖像的多個源使用「srcset」的圖片：

<img alt="Cat Dancing" src="small-1.jpg" 
srcset="small-2.jpg 2x, // this is pretty cool 
large-2.jpg 100w,  // meh 
large-2.jpg 100w 2x  // [email protected] 
">

我個人認爲這是一個很大的醜陋（它讓你控制較少的瀏覽器決定要加載的圖像），但是從我的理解第二個解決方案已被添加到o fficial規範（在某些能力）

這些建議的唯一真正的目前的解決方案是先從2倍的原始尺寸的圖像（或1.5倍根據自己的喜好）

外它可能會嘗試得到所有幻想和做一個JavaScript解決方案，但我認爲這將過於複雜的事情...

下面是一個非常好的文章，討論你描述的問題（我覺得我漫步了一下！）： http://www.alistapart.com/articles/mo-pixels-mo-problems/

來源

2012-11-07 11:26:07 Sean

處理視網膜顯示的最佳方式是什麼？

回答

相關問題