钧言极客站钧言极客

钧言极客

CSS 图片显示模糊解决方法

css

旁边的brand的图片明显糊掉,但是设置 height: 100%; ,一样会显示模糊不清。经过一番咨询好友后,得到以下答案并解决了问题。

使用 image-rendering 优化

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

兼容性

使用兼容性没有问题,不会还有人使用IE吧!!

.brand img {
  image-rendering: -webkit-optimize-contrast;
}

使用这个方法就可以解决css的图片缩放带来的图片模糊问题。

版权声明:本文采用知识共享 署名4.0国际许可协议 [BY-NC-SA] 进行授权
文章名称:《CSS 图片显示模糊解决方法》
文章链接:https://www.jinjun.top/420.html
本站资源仅供个人学习交流,请于下载后24小时内删除,不允许用于商业用途,否则法律问题自行承担。

评论 2

  1. 鸟叔抢个沙发

    鸟叔 2022年04月19日    回复