css设置宽高100%以后像素丢失，处理方式

原创于 2024-01-26 17:39:38 发布 · 637 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#css #前端

博客展示了CSS设置前后的对比图，体现出较大差异。代码参考了其他大佬的，并且考虑了兼容性问题，聚焦于前端CSS技术应用。

可以看下前后对比图

没设置之前

设置之后

可以看见还是有很大的对比的，代码是看另外大佬的，并且考虑了兼容的问题

/* 图片设置100%以后像素丢失 */
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) */
}