Fliter 图片修饰特效之二，CSS教程

2024-09-05 12:16:53

字体：大中小

来源：转载

供稿：网友

一个CSS教程，主要讲Fliter滤镜的使用方法，将一幅图片修饰成不同的效果，类似反光、翻转图片、副片、单色、增加通道等图像专业效果。通过这个小教程，你或许会对Fliter有个熟悉的了解。

<!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"><head><title>css属性实例</title><style> .p1{ filter : progid:DXImageTransform.Microsoft.BasicImage( grayScale="1");}.p2{ filter : progid:DXImageTransform.Microsoft.BasicImage( mirror="1");}.p3{ filter : progid:DXImageTransform.Microsoft.BasicImage( opacity="0.5");}.p4{ filter : progid:DXImageTransform.Microsoft.BasicImage( XRay="1");}.p5{ filter : progid:DXImageTransform.Microsoft.BasicImage( Invert="1");}.p6{ filter : progid:DXImageTransform.Microsoft.BasicImage( Mask="1",MaskColor="#666666");}.p7{ filter : progid:DXImageTransform.Microsoft.BasicImage( Rotation="1");}p{ float:left; border:2px solid #000000; margin:0 10px 10px 0;}img{ width:250px;} </style></head> <body> <img src="http://www.aspku.com/jscss/demoimg/pic.jpg" /> <img src="http://www.aspku.com/jscss/demoimg/pic.jpg" /> <img src="http://www.aspku.com/jscss/demoimg/pic.jpg" /> <img src="http://www.aspku.com/jscss/demoimg/pic.jpg" /> <img src="http://www.aspku.com/jscss/demoimg/pic.jpg" /> <img src="http://www.aspku.com/jscss/demoimg/pic.jpg" /> <img src="http://www.aspku.com/jscss/demoimg/pic.jpg" /></body></html>

上一篇：Css filter:滤镜修饰图片实例

下一篇：用Css定义不同的鼠标光标样式

学习交流

如何查找有故障的配件

如何查找有故障的配件...

热门图片

猜你喜欢的新闻

猜你喜欢的关注