图片滤镜代码大全-白红宇

图片滤镜代码大全

阅读量：4190 次

发布时间：2019-05-26

本文共 2789 字，大约阅读时间需要 9 分钟。

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=" " style="FILTER: xray(color=#ffedff)"<

彩色反相:

>IMG src=" " 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.Ｘ光效果 : >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

你可能感兴趣的文章

程序员准时下班碰见领导，次月发工资时看到绩效莫名被扣20％

查看>>

你见过最牛逼的程序员是什么样的？拳打回车键，脚踩Emacs编辑器

查看>>

相比加班的程序员，企业更喜欢“偷懒”的程序员？程序员偷的不是懒，是高效！

查看>>

初学Java必备基础知识，编程领域你需要掌握的关键点！