使用CSS更改PNG图像的颜色

html-css020

使用CSS更改PNG图像的颜色,第1张

给定一个图像,如何使用CSS更改PNG图像的颜色?下面本篇文章就来给大家使用CSS更改PNG图像颜色的方法,希望对大家有所帮助。 在CSS中使用Filter属性,利用滤镜功能来更改png图像颜色;CSS的Filter属性主要用于设置图像的视觉效果。 Filter属性存在许多属性值:示例1: 使用灰度滤镜将彩色图像更改为灰度图像 输出: 原始图像: 应用过滤器后:示例2: 此示例对图像使用许多过滤器。 效果图: 更多 web前端 知识,请查阅 HTML中文网 !!

加了代码网页变黑白没效果的进 这里有所有的代码教程

下面我们来看看如何将网页变成黑白的。如果你的网站是静态页面,能够支持支持CSS,那就方便很多了。只要是符合W3标准的网页,在CSS文件的最前面加上一行代码就可以了,这段代码使用的是CSS滤镜,将网页中的色彩部分给滤掉了。

CSS滤镜过滤色彩代码:

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

使用方法:这段代码可以变网页为黑白,将代码加到CSS最顶端就可以实现素装。

有一些站长的网站可能使用这个css 不能生效,是因为网站没有使用最新的网页标准协议

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

请将网页最头部的替换为以上代码。

有一些网站FLASH动画的颜色不能被CSS滤镜控制,可以在FLASH代码的和之间插入:

<param value="false" name="menu"/>

<param value="opaque" name="wmode"/>

最简单的把页面变成灰色的代码是在head 之间加

<style type="text/css">

html {

FILTER: gray

}

</style>

或者:

<body style="filter:Gray">