css3 给图片加滤镜

CSS3是一种常用的前端技术，它可以让网页更美观，交互性更强。CSS3还有一个重要的用途就是可以给图片加上各种滤镜，比如变亮、变暗、灰度、模糊等效果。

img{
    filter: brightness(150%);
    filter: contrast(200%);
    filter: grayscale(80%);
    filter: blur(3px);
}
    

以上代码展示了如何给图片添加一些常用的滤镜效果，可以通过修改滤镜值来调整效果。例如，brightness可以改变图片的亮度，contrast可以改变图片的对比度，grayscale可以将图片转化为灰度图像，blur可以让图片模糊。

要注意的是，滤镜效果需要浏览器的支持，不同浏览器对于滤镜的支持情况有很大差异，有些浏览器可能不支持某些滤镜效果，因此在实际应用中需要进行兼容处理。

除了以上四种常用的滤镜效果，CSS3还支持其他更加复杂的滤镜效果，比如像素化、反色、色彩增强等等。掌握滤镜效果的使用方法，可以为网页设计带来更多的创意和亮点。

在实际开发中，需要根据具体的需求来选择适合的滤镜效果，并根据浏览器支持情况进行兼容处理，这样才能让网页达到更好的效果。

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