CSS 属性 image-rendering 用于设置图像缩放算法。它适用于元素本身，适用于元素其他属性中的图像，也应用于子元素

当页面作者指定的尺寸不是图像的原始尺寸时，用户代理将缩放图像。缩放也可能由于用户互动（双指缩放）而发生。举个例子，如果有一张尺寸为 100×100px 的图片，但作者有意将尺寸设置为 200×200px（或50×50px），然后，图片便会根据 image-rendering 指定的算法，缩小或放大到新尺寸。此属性对于未缩放的图像没有影响。
 

用法

.call-img {
    width: 34rpx;
    height: 34rpx;
    margin-right: 20rpx;
    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这四行代码直接复制到图片样式上就可以了
 

其他属性：

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

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

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

smooth： 应使用能最大化图像客观观感的算法来缩放图像。特别地，会“平滑”颜色的缩放算法是可以接受的，例如双线性插值。这适用于照片等类型的图像。

high-quality：与 smooth 相同，但更倾向于高质量的缩放。如果系统资源受到限制，在考虑降低哪些图像的质量以及降低到什么程度时，high-quality 的图像应该优先于任何其他值的图像。