怎么通过css改变图片的颜色

html-css013

怎么通过css改变图片的颜色,第1张

1、如果想改变css背景图片,一般的做法只能使用css滤镜;

2、css滤镜主要包括:

Speia滤镜 灰度图滤镜 高斯模糊滤镜 反色滤镜 饱和度滤镜

对比度滤镜亮度滤镜色相旋转滤镜 阴影滤镜

3、css滤镜在浏览器兼容是比较坑爹的问题,ie浏览器有自己一套滤镜filter家族,基本所有ie内核浏览器都支持,ff和Chrome,opera则主要使用css3的滤镜,这些浏览器在后期版本支持css3的滤镜(目前版本基本都支持html5和css3),通过滤镜改变背景图的颜色和效果,当然这些滤镜主要是为了效果而产生,颜色只是固定的几种效果。

4、个别时候,css滤镜还需要结合js使用,才能到达必要效果,其实一般背景图片都是用透明度的css来设置它的颜色度;

透明度css列子:

transparent_class {

filter:alpha(opacity=50)

-moz-opacity:0.5

-khtml-opacity: 0.5

opacity: 0.5

}

CSS不可以同时定义两个背景,不过你可以嵌套一下,比如:在div里面嵌套一个span,然后可以分别设置背景,以达到自己想要的效果。

做渐变的背景,要突破浏览器的限制,建议用图片做,先在PS 里面根据需要(纵向或横向)制作一张渐变的图片,然后,裁切成1px高或宽的条。

然后在设置背景的时候, 横向(repeat-x)或纵向平铺(repeat-y)就可以了。

如果是纵向渐变,就做竖条,横向平铺。横向渐变,就是做横条,纵向平铺就可以了。 就这么简单。

这个是变黑白的,你参照下方法,看看能不能变红色。

在你网站的CSS文件力加入此代码即可自动把网站一切颜色变成单色,哀悼日过后删除代码即可还原彩色 复制内容到剪贴板

代码:html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)}