标签：
图标要设置宽度和高度的话，单位记得是rem.
图片宽度:max-width:100%;,也要给高度.
<img src="mm-width-128px.jpg"
srcset="mm-width-128px.jpg 1x, mm-width-256px.jpg 2x，mm-width-512px.jpg 3x">
或者:
<img class="image" src="mm-width-128px.jpg"
srcset="mm-width-128px.jpg 128w, mm-width-256px.jpg 256w, mm-width-512px.jpg 512w"
sizes="(max-width:360px) 340px, 128px">
/*视区宽度不大于360像素时候，图片实际尺寸340像素*/
如果是用背景图的方法就这样:
/* retina image */
@media only screen {
}
@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolute:300dpi), only screen and (min-resolute: 2dppx) {
}
最后可以参考下:
http://www.zhangxinxu.com/wordpress/2014/10/responsive-images-srcset-size-w-descriptor/
图标和图片(最佳自适应方案)
标签：
原文地址：http://www.cnblogs.com/windtony/p/4481335.html
