html css img 图片设置宽高厚，图片失真模糊问题

img {    

image-rendering: -moz-crisp-edges; /* Firefox */     image-rendering: -o-crisp-edges; /* Opera */      image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */ image-rendering: crisp-edges; \-ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */

}

image-rendering说明

dome：

 属性值说明：

auto：默认值。使用浏览器的标准算法最大化图像的外观；

crisp-edges：使用算法达达到在绽放时保持对比度和边缘，在加工时不平滑色彩和使用模糊

pixelated：当图片放大时，单纯地去放大像素点，缩小时与auto效果一样，即矢量化；

注：此属性可应用于背景图像、canvas元素、打印图片设置以及内联图像。重要的是要注意，这些值尤其令人困惑，因为缺乏一致的浏览器支持。

参考文献：https://my.oschina.net/u/1403186/blog/1509962