Tag: css滤镜

css滤镜效果

没有评论

2010 年 09 月 08 日 at 下午 8:06分类:CSS

http://zhangjingqiang.blog.51cto.com/648409/186838

<html>

<head>

<title>

</title>

<style>

div{ border:0px solid red; background-color:red; width:303px; height:180px; }

a:hover img{ filter:alpha(opacity=50); }

</style>

</head>

<body>

<div>

<a href=”"><img src=”kai.jpg” border=”0″></a> </div>

</body><

/html>

<html>

<head>

<title>alpha滤镜</title> <style>

<!– body{ background:url(bg1.jpg); margin:20px; } img{ border:1px solid #d58000; } .alpha{ filter:alpha(opacity=0,finishopacity=100,style=1,startx=0,starty=0,finishx=0,finishy=100); /* 从上到下渐变 */ } –> </style>

</head>

<body>

<img src=”kai.jpg” border=”0″> <img src=”kai.jpg” border=”0″>

</body>

</html>

<html>

<head>

<title>alpha滤镜</title>

<style>

<!– body{ background:url(bg1.jpg); margin:10px; } .alpha1{ filter:alpha(opacity=100,finishopacity=0,style=2); /* 圆形渐变,中间不透明,四周透明 */ } .alpha2{ filter:alpha(opacity=0,finishopacity=80,style=2); } –> </style>

</head>

<body>

<center> <img src=”kai.jpg”><br><br> <img src=”kai.jpg”> </center> </body> </html

<html> <head> <title>alpha滤镜</title> <style> <!– body{ background:url(bg1.jpg); margin:10px; } .alpha1{ filter:alpha(opacity=100,finishopacity=0,style=3); /* 矩形渐变,中间不透明,四周透明 */ } .alpha2{ filter:alpha(opacity=0,finishopacity=100,style=3); /* 反之 */ } –> </style> </head> <body> <center> <img src=”kai.jpg”> <img src=”kai.jpg”> <img src=”kai.jpg”>
</center>
</body>
</html>
<html>
<head>
<title>MotionBlur滤镜</title>
<style>
<!– body{ margin:10px; } .motionblur{ filter:progid:DXImageTransform.Microsoft.MotionBlur(strength=30,direction=90,add=true);    /* 水平向右 */ } –> </style> </head> <body> <img src=”kai.jpg”> <img src=”kai.jpg”>
</body>
</html>

网站全部变灰效果

没有评论

2010 年 09 月 08 日 at 下午 8:03分类:CSS

方法一是:
在你的网站页面上
<head></head>
之间加上下面这段代码:

<style type=”text/css”>
body {filter:gray}
</style>
方法二是:
在你的网站页面上
<head></head>
之间加上下面这段代码:

<style>
html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}
</style>
方法三是:
找到你的网站CSS文件,把下面的代码放到网站的css文件头部中(此为教育网采用的方法)

body{
filter:gray;
}
方法四是:
找到你的网站CSS文件,把下面的代码放到网站的css文件头部中

html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
方法五是:
找到你的CSS文件然后修改css代码文件。在以下的文件当中
form,div,span,img,ul,ol,li, {
加入filter: Gray;

有一些网站FLASH动画的颜色不能被CSS滤镜控制,可以在FLASH代码的<object …>和</object>之间插入:
复制内容到剪贴板
代码:
<param =”false” name=”menu”/>
<param =”opaque” name=”wmode”/>