给定一个图像,如何使用CSS更改PNG图像的颜色?下面本篇文章就来给大家使用CSS更改PNG图像颜色的方法,希望对大家有所帮助。
如何使用CSS更改PNG图像的颜色?_第1张图片
原文地址:如何使用CSS更改PNG图像的颜色?

在CSS中使用Filter属性,利用滤镜功能来更改png图像颜色;CSS的Filter属性主要用于设置图像的视觉效果。

Filter属性存在许多属性值:

filter: none|blur()|brightness()|contrast()|drop-shadow()|grayscale()|hue-rotate()|invert()|
            opacity()|saturate()|sepia()|url();

示例1:使用灰度滤镜将彩色图像更改为灰度图像



    
        
        转换为灰度图像
        
    

    
        filter applied
    
    

输出:

原始图像:

如何使用CSS更改PNG图像的颜色?_第2张图片

应用过滤器后:
如何使用CSS更改PNG图像的颜色?_第3张图片

示例2:此示例对图像使用许多过滤器。



    
        
        将图像转换为不同的颜色
        
    

    
     filter applied

     filter applied 
    
    

效果图:
如何使用CSS更改PNG图像的颜色?_第4张图片
推荐阅读:

php服务器

php5下载

layui框架