图片效果代码

一、几个基本的效果

1.鼠标滑过更改图片整体透明度代码
<img src="地址" width="宽" height="高" style="FILTER:alpha(opacity=30)" onMouseOver="this.style.filter='alpha(opacity=100)'" onMouseOut="this.style.filter='alpha(opacity=30)'">

2.淡化边缘椭圆效果代码
<img style="FILTER: Alpha(opacity=100,style=2)" src="地址" width="宽" height="高">

3.淡化边缘方型效果代码
<img style="FILTER: Alpha(opacity=100,style=3)" src="地址" width="宽" height="高">

4.淡化边缘右边效果代码
<img style="FILTER: Alpha(opacity=100,style=1)" src="地址" width="宽" height="高">

5.重叠效果代码
<div style="FILTER: blur(add=true,direction=135,strength=15); WIDTH: 600px"><img src="地址" width="宽" height="高"> </div>

6.扭曲效果代码
<div style="FILTER: wave(add=0,freq=1,lightStrength=20,phase=50,strength=20); WIDTH: 600px">
<img src="地址" width="宽" height="高"></div>

7.翻转效果代码
<div style="FILTER: flipH; WIDTH: 600px"><img src="地址" width="宽" height="高"></div>

8.去色效果代码
<IMG style="FILTER: gray" src="地址" width="宽" height="高">

 

二、组合

鼠标滑过淡化边缘椭圆

<img src="地址" width="宽" height="高" style="FILTER: Alpha(opacity=70,style=2)" onMouseOver="this.style.filter='alpha(opacity=100)'" onMouseOut="this.style.filter='FILTER: Alpha(opacity=70,style=2)'">

转载于:https://www.cnblogs.com/noreen/articles/1517369.html