img中png格式通过属性修改颜色

原因：我在工作时修改需求，蓝色icon更变为灰色，设置color属性生效但不显示。

解决如下：

 $(".search").css({ "filter": "grayscale(100%)" })

在css中filter可以利用滤镜功能来换图片的颜色，filter属性定义了元素(通常是<img>)的可视效果，此属性主要用于图像内容。

相关属性值：

• grayscale()：设置元素的灰度，它将元素颜色转换为黑色和白色。灰度0％表示原始元素，100％表示完全灰度元素。

• sepia()：它将图像转换为棕褐色图像，其中0％表示原始图像，100％表示完全棕褐色。

• hue-rotate()：它将色调旋转应用于图像。该值定义将调整图像样本的色环周围的度数。默认值为0deg，表示原始图像；该值虽然没有最大值，超过360deg的值相当于又绕一圈。

• invert()：它反转元素。默认值为0％，表示原始图像。100％使图像完全反转。