分享

【音画教学】图片特效代码大全

 DLLC1234 2011-12-09

图片特效代码大全



DLLC1234制作


1.图片向上移动:

代码:
<MARQUEE direction=up height=180 scrollAmount=3>
<CENTER><IMG src=http://image48.360doc.com/DownloadImg/2011/12/0916/19906047_7.jpg></CENTER></MARQUEE>

效果:

2.图片向下移动:

代码:

<MARQUEE direction=down height=180 scrollAmount=3>
<CENTER><IMG src=http://image48.360doc.com/DownloadImg/2011/12/0916/19906047_8.jpg></CENTER></MARQUEE>

效果:
 

3.图片向左移动:

代码:

<marquee><img src=http://image48.360doc.com/DownloadImg/2011/12/0916/19906047_7.jpg></marquee>

效果:

 


4.图片向右移动:

代码:
<marquee direction=right><img src= http://image48.360doc.com/DownloadImg/2011/12/0916/19906047_8.jpg width=190 height=130></marquee>

效果:

5.图片左右来回移动:

代码:

<MARQUEE behavior=alternate width="100%" scrollAmount=5><IMG src=http://userimage2.360doc.com/11/1118/21/2904667_201111182122360268.gif></MARQUEE>

效果:

6.图片中间分开向上下移动:

代码:

<MARQUEE direction=up scrollAmount=3>
<CENTER><IMG src=http://userimage2.360doc.com/11/1118/04/2904667_201111180449060737.gif></CENTER></MARQUEE>
<MARQUEE direction=down scrollAmount=3>
<CENTER>
<DIV style="FILTER: flipv; WIDTH: 350px"><IMG src="http://userimage2.360doc.com/11/1118/04/2904667_201111180449060737.gif"></DIV></CENTER></MARQUEE>

效果:

7.图片中间分开向左右移动:

代码:
 
<CENTER><BR>
<MARQUEE height=300 width=350 scrollAmount=3><IMG src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif"></MARQUEE>
<MARQUEE direction=right height=300 width=350 scrollAmount=3><IMG style="FILTER: fliph" src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif"></MARQUEE></CENTER>

效果:

8.图片倒影:

代码:
 <CENTER><IMG src="http://userimage2.360doc.com/11/1118/04/2904667_201111180449060737.gif" width=350><BR><IMG style="FILTER: flipv; WIDTH: 350px" src="http://userimage2.360doc.com/11/1118/04/2904667_201111180449060737.gif" width=350 height=200></CENTER>

效果:

 

9.图片左右颠倒:

 
代码:
 
 
效果:
 

10.图片黑白显示:

 
代码:
 
 
效果:
 
 

11.图片方形羽化:

 
代码:
 
<CENTER><IMG style="FILTER: Alpha(opacity=100,style=3)" src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif" width=350></CENTER>
 
效果:
 
 
 

12.图片圆形羽化:

 
代码:
 
<CENTER><IMG style="FILTER: Alpha(opacity=100,style=2)" src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif" width=350></CENTER>
 
效果:
 
 
 

13.图片右侧羽化:

 
代码:
 
<CENTER><IMG style="FILTER: Alpha(opacity=100,style=1)" src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif" width=350></CENTER>
 
效果:
 
 
 

14.图片左侧羽化:

 
代码:
 
<CENTER><IMG style="FILTER: alpha(opacity=0,finishopacity=100,startx=0,starty=0,finishx=60,finishy=0,style=1)" src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif" width=350></CENTER>
 
效果:
 
 
 

15.图片上部羽化:

 
代码:
 
<CENTER><IMG style="FILTER: alpha(opacity=0,finishopacity=100,startx=0,starty=0,finishx=0,finishy=80,style=1)" src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif" width=350></CENTER>
 
效果:
 
 

16.给图片加邮票边框:

 
代码:
 
<DIV align=center>
<DIV style="BORDER-BOTTOM: #000000 5px dashed; BORDER-LEFT: #000000 5px dashed; BACKGROUND-COLOR: #ffffe0; WIDTH: 350px; BORDER-TOP: #000000 5px dashed; BORDER-RIGHT: #000000 5px dashed"><IMG src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif" width=350 height=300></DIV></DIV>
 
效果:
 
 
 

17.给图片加双实线边框:

 
代码:
 
<DIV align=center>
<DIV style="BORDER-BOTTOM: #8b008b 8pt double; BORDER-LEFT: #8b008b 8pt double; WIDTH: 350px; BORDER-TOP: #8b008b 8pt double; BORDER-RIGHT: #8b008b 8pt double"><IMG src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif" width=350 height=300></DIV></DIV>
 
效果:
 
 
 

18.给图片加凹进边框:

 
代码:
 
<DIV align=center>
<DIV style="BORDER-BOTTOM: #afa352 10pt outset; BORDER-LEFT: #afa352 10pt outset; WIDTH: 350px; BORDER-TOP: #afa352 10pt outset; BORDER-RIGHT: #afa352 10pt outset"><IMG src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif" width=350 height=300></DIV></DIV>
 
效果:
 
 
 

19.给图片加突出边框:

 
代码:
 
<DIV align=center>
<DIV style="BORDER-BOTTOM: 10pt ridge; BORDER-LEFT: 10pt ridge; BACKGROUND-COLOR: #8b008b; WIDTH: 350px; BORDER-TOP: 10pt ridge; BORDER-RIGHT: 10pt ridge"><IMG src="http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif" width=350 height=300></DIV></DIV>
 
效果:
 

20.人物在图片上飘浮:

 
代码:
 
<CENTER>
<TABLE border=5 borderColor=#cd5c5c width=350 align=center height=300>
<TBODY>
<TR>
<TD background=http://userimage2.360doc.com/11/1109/02/2904667_201111090220490362.gif>
<MARQUEE direction=down height=300 behavior=alternate scrollAmount=3>
<MARQUEE behavior=alternate width=338 scrollAmount=3><IMG style="WIDTH: 70px; HEIGHT: 260px" src="http://userimage2.360doc.com/11/1210/03/2904667_201112100306500867.gif" width=70 height=260></MARQUEE></MARQUEE></TD></TR></TBODY></TABLE></CENTER>
 
效果:
 
 

    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约