css滤镜实现鼠标悬停图片变黑白(灰色) -懒人源码

css滤镜实现鼠标悬停图片变黑白(灰色)

作者/代码整理：懒人 (转载请附加本文地址，带有“懒人原生”字样的谢绝转载) 发布日期：2014-12-26

效果描述：

默认图片是彩色效果，当鼠标悬停在图片上后，图片变成灰白色

(注意：不兼容IE10)

原理：

其实只要给图片悬停的hover效果加一个样式即可，即 filter: grayscale(100%);

使用方法：

1、将css样式引入到你的网页中

2、将body中的代码部分拷贝到你需要的地方即可

(图片采用绝对路径，不建议修改路径)

声明：凡标题注明“懒人原生”二字，均为本站原创，非书面授权谢绝转载