图片滤镜代码大全

来源:互联网 发布:2017高三生物优化设计 编辑:程序博客网 时间:2024/04/27 14:16
2007年08月23日 19:17:00

效果如下:

代码:
>left<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="filter=alpha(opacity=100,style=1,finishopacity=0)"<>/left<
效果如下:

代码:
>left<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="filter=alpha(opacity=100,style=2,finishopacity=0)"<>/left<
效果如下:

代码:
>left<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3"style="FILTER: Chroma(Color=#13629f)"<>/left<
效果如下:

代码:
>left<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="filter=alpha(opacity=100,style=3,finishopacity=0)"<>/left<
效果如下:

代码:
>left<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="filter:'gray'"<>/left<
效果如下:

代码:
>left<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="filter:progid:DXImageTransform.Microsoft.Emboss()"<>/left<
效果如下:

代码:
>left<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="filter:flipv"<>/left<
效果如下:

代码:
>left<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="filter:fliph"<>/left<
效果如下:

代码:
>left<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="filter:wave(freq=11, strength=4, phase=6, lightstrength=10)"<>/left<

去色并反相:
>IMG src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="FILTER: xray(color=#ffedff)"<
彩色反相:
>IMG src="http://s4.album.sina.com.cn/pic/48af9767020009v3" style="FILTER: invert(color=#ffedff)"<
重叠效果:


代码:
>div style="width:358;filter:blur(add=true,direction=135,strength=15);"<>img src="http://s4.album.sina.com.cn/pic/48af9767020009v3" width="165" height="350"<>/div<

原图:

1.原圖 : >img src="圖片.jpg"<

2.柔邊效果-均勻 : >img src="圖片.jpg" style="filter:alpha(opacity=25, finishOpacity=25,style=0)"<

3.柔邊效果-線狀(左往右) : >img src="圖片.jpg" style="filter:alpha(opacity=0, finishOpacity=100,style=1)"<

4.柔邊效果-圓形(外往中央): >img src="圖片.jpg" style="filter:alpha(opacity=100, finishOpacity=0,style=2)"<

5.柔邊效果-圓形(中央往外): >img src="圖片.jpg" style="filter:alpha(opacity=100, finishOpacity=0,style=3)"<

6.詼諧效果 : >img src="圖片.jpg" style="filter: gray"<

7.X光效果 : >img src="圖片.jpg" style="filter: Xray"<

8.色彩對換 : >img src="圖片.jpg" style="filter:invert"<

9.左右翻轉 : >img src="圖片.jpg" style="filter:FlipH()"<

10.上下翻轉 : >img src="圖片.jpg" style="filter:FlipV()"<

11.發光效果 : >div style="width: 134px; height: 140px;filter:glow(color=#ffffff, strength=6)"<>img src="圖片.jpg" <>/div< 12.附陰影效果 : >div style="width: 134px; height: 140px;filter:shadow(color:#333333,direction=150);"<>img src="圖片.jpg" <>/div<

13.投射陰影效果 : >DIV style="FILTER: Dropshadow(color:#333333,direction=150,offX=5,offY=5); WIDTH: 134px; HEIGHT: 140px"<>img src="圖片.jpg" <>/div<

14.波形效果 : >DIV style="FILTER: Wave(strength=5,lightstrengh=5); WIDTH: 134px; HEIGHT: 140px"<>img src="圖片.jpg" <>/div<

15模糊效果 : >DIV style="FILTER:Blur(direction=150); WIDTH: 134px; HEIGHT: 140px"<>img src="圖片.jpg" <>/div<



Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=1756538


原创粉丝点击