css3 设置黑白图片

CSS3提供了一种设置图片为黑白的方法，通过使用CSS滤镜可以轻松地实现这样的效果。

/* 设置图片为黑白 */img {
    filter: grayscale(100%);
}

上述代码中，grayscale(100%)表示将图片的饱和度设置为0，即变为黑白色。

如果希望在鼠标悬停时恢复原色，可以使用以下代码：

/* 鼠标悬停时恢复原色 */img:hover {
    filter: grayscale(0%);
}
    

使用CSS3设置黑白图片非常简单，只需一行代码即可实现。但需要注意的是，该方法并不适用于所有浏览器，部分老旧版本的浏览器可能无法支持这一功能。因此，为了更好的兼容性，建议在实际应用中使用其他方法。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！