新版webkit内核支持srcset显示高分辨率

随着Retina屏的出现，Safria率先支持了srcset，在响应式的网站中，各种尺寸的终端可以迅速调整图片的大小，新版的webkit浏览器已经全面支持该属性。

<img src="init-image.jpg" srcset="f-image.jpg 2x" />

开发人员只需提供一个备用的文件名(alternate filename)和倍数放大(resolution multiplier)，比如1x、2x或4x。”Resolution Multiplier”是用来衡量”多少个物理像素组成’一个’像素点的方法”，例如iPhone 5的屏幕分辨率为1136×640，但”显示分辨率”为568×320。这意味着4个物理像素组成了一个”显示像素”，或称”4x multiplier”。
这样其中的一个好处是，持有高分辨率显示设备的用户（典型的如苹果设备的用户）能很轻松得浏览那些能提供高质量图片的网站，从而带来很好的用户体验。与此同时，那些使用普通显示分辨率的用户也不会因为网络带宽等问题而懊恼浏览高分辨率图片较多的网站，因为这些网站能提供适合他们观看的图片。

还有一种显示方法，

<img src="init-image.jpg" srcset="f-image.jpg 480w" />

这里的480w的意思表示最大viewport为480px的情况。

注意

那些不支持srcset的浏览器会直接忽略掉它，对用户而言不会产生任何不良影响。

查看原文请参考网址：http://mingkr.com/webkit-srcset

查看原文网站首页：http://mingkr.com