注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

梦中人の梦工场

这里有爱的细雨,这里有情的倾诉。这里帮你筑梦,帮你圆梦!

 
 
 

日志

 
 
关于我

喜欢做梦,从小到大,始终不变,喜欢研究,海阔天空,天文地理,喜欢交友,不分老幼,不分男女。

网易考拉推荐

图片特效、FLASH、3D相册代码  

2009-06-08 22:03:17|  分类: 博客装扮 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
梦中人の梦工场欢迎您

一、图片代码基础

1.基本代码

<img src=图片网址 width=图片宽度 height=图片高度>

新代码:<IMG style="DISPLAY: block; TEXT-ALIGN: center" src="http://img.bimg.126.net/photo/UrLPZXvym9HfHqv7udi_iw==/2583658811228504109.jpg*p+)" border=0>

2、用图片链接代码(1):

 <A href="链接的网址" target=_blank><IMG src="图片地址>" border=0></A>

   用图片链接代码(2):

<A href= "http://ysh6766.blog.163.com/>" target=_blank><IMG height=400 alt="

点击图片即可进入梦中人梦工场"

 src="http://img.blog.163.com/photo/NRNeXIWj1oqgUXvnbX0BgA

==/615022824112846647.jpg" width=300> </A>

3、直接在图片上写文字:   

<div align="center"><div style="background-image: url图片地址 background-repeat: repeat; background-attachment: scroll; font-style: normal; font-variant: normal; font-weight: normal; line-height: 25px; font-size: 12px; font-family: verdana; width:(图片宽) height:(图片高) padding-left: 10px; padding-right: 0px; padding-top: 14px; background-"><br /><div align="left">
<div style="PADDING-RIGHT: 0px; PADDING-LEFT: 10px; FILTER: alpha(opacity=60); WIDTH:
文字范围(宽)HEIGHT:文字范围(高)>文字内容
</div></div><br /></div></div>

4、大图片上加小图片

 <P align=center>
<TABLE style="BORDER-RIGHT: 0px solid; BORDER-TOP: 0px solid; BORDER-LEFT: 0px solid; BORDER-BOTTOM: 0px solid" height=317 cellSpacing=0 cellPadding=0 width=599 background=背景图片地址 border=0>
<TBODY>
<TR>
<TD>
<IMG src="小图片地址" width=60 align=center> </TD></TR></TBODY></TABLE></P>

  5、.给图片加边框

1)、单线框

  <img src="图片地址" style="border:5 solid #ffCCCC">

  2)、双线框

  <img src="图片地址" style=" border:7 double #666FF">

  3)、虚线框

  <img src="图片地址" style=" border:3 dashed #990000">

  4)、凸出框:

  <img src="图片地址" style="border:10 outset #CCCCFF">

  5)、嵌入框:

  <img src="图片地址" style="border:15 inset #ff9900">

  6)、脊状框:

  <img src="图片地址" style="border:15 ridge #33FF66">

  7)、凹槽框

  <img src="图片地址" style="border:15  groove #CC6666">

  8)、粒状阴影框

  <img src="图片地址" style="filter:progid:DXImageTransform.Microsoft.Glow(color=#ccFF66,strength=30">

9)可以调节宽度和高度的边框代码 

<table border=6 cellSpacing=2 cellPadding=1 borderColor=#841A00><tr>

<td><img src=图片网址 width=600 height=407></td></tr></table>

说明:

border="6" 表格边框的厚度

cellspacing="2" 表格格线的厚度

cellPadding=1 表格格线内厚度

borderColor=#841A00 边框色彩

注解:

     width="400" 表格宽度,接受绝对值(如 80)及相对值(如 80%)。
     border="1" 表格边框的厚度。
     cellspacing="2" 表格格线的厚度
     align="CENTER" 表格的摆放位置(水平),可选值为: left, right, center
     valign="TOP". 表格里内容的对齐方式(垂直),可选值为: top, middle, bottom。
     background="myweb.gif" 表格的背景图片,与 bgcolor 不要同用。
     bgcolor="#0000FF" 表格的底色,与 background 不要同用
     bordercolor="#CF0000" 表格边框颜色
     bordercolorlight="#00FF00" 表格边框向光部分的颜色 
     bordercolordark="#00FFFF" 表格边框背光部分的颜色,

      使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。
      cols="2" 表格栏位数目,只是让浏览器在下载表格时先画出整个表格而已。

<table cellpadding=参数>...</table>指定内容与网格线之间的间距(使用数字)   

<table cellspacing=参数>...</table>指定网格线与网格线之间的距离(使用数字)   

<table cols=参数>...</table>指定表格的栏数   

<table frame=参数>...</table>设定表格外框线的显示方式   

<table width=宽度>...</table>指定表格的宽度大小(使用数字)   

<table height=高度>...</table>指定表格的高度大小(使用数字)   

<td colspan=参数>...</td>指定储存格合并栏的栏数(使用数字)   

<td rowspan=参数>...</td>指定储存格合并列的列数(使用数字)   

<!>分割窗口   

<frameset cols="20%,*">左右分割,将左边框架分割大小为20%右边框架的大小浏览器会自动调整   

<frameset rows="20%,*">上下分割,将上面框架分割大小为20%下面框架的大小浏览器会自动调整   

<frameset cols="20%,*">分割左右两个框架   

<frameset cols="20%,*,20%">分割左中右三个框架   

<分割上下两个框架   

<frameset rows="20%,*,20%">分割上中下三个框架     

6、留言贴图片

<P align=center><A href="http://ysh6766.blog.163.com>" target=_blank>

<IMG alt=梦中人拜访朋友  size="4">src="图片地址+"></A></P> 

7、文章的左侧贴图片 

<P align=center><IMG height=200 hspace=50 

src="http://img.bimg.126.net/photo/04rYa6gZB84y8m0xpU0-gw

==/2327235107444348335.jpg" width=150 align=left border=0></P>

<P><FONT color=#e10900>你的文章内容</FONT></P>

8、文章的右侧贴图片

<P align=center><IMG height=200 hspace=100

src="http://img.bimg.126.net/photo/04rYa6gZB84y8m0xpU0-gw

==/2327235107444348335.jpg" width=150 align=right border=0></P>
     <P><FONT color=#e10900>你的文章内容</FONT></P>

9、图片并列排版代码:
 <DIV align=center>

<IMG  src="图片地址"><IMG  src="图片地址">

<IMG  src="图片地址"><IMG  src="图片地址"></DIV>

10、图片朦胧效果

A.圆形效果

代码: 

<IMG src="图片" width=500 height=375 style="filter:Alpha(opacity=100,style=2);">

B.方形效果

代码:

<IMG src="图片" style="FILTER: Alpha(opacity=200,style=3)"

width=500 height=375>

C.椭圆效果

代码: 

<IMG src="图片" style="filter:Alpha(opacity=100,finishO

pacity=0,style=2)" width=500 height=375>

D.  右侧羽化效果

<IMG src="图片地址" style="filter=alpha(opacity=100,style=1,finishopacity=0)" width=500 height=375>

         E.  风状羽化效果

<IMG src="http://img.blog.163.com/photo/1v3gePBXMSGLBSqZtdi52A==/3952753097948309555.jpg" style="filter:blur(direction=135,strength=100)" width=500 height=375>

       F.最新代码<IMG style="FILTER: alpha(opacity=100,style=2)" src="图片地址" width=500 TYPE="image">

11、更为适用小图片200X200的朦胧图片代码

<TABLE align=center border=0>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity=100,style=2)" width=200 background=http://img.blog.163.com/photo/xPtjg97_UVzJFz72NNGF7w==/4806748177288317599.jpg height=200></TD></TR></TBODY></TABLE>

其中:opacity:开始处的透明度,finishOpacity:结束处的透明度;

       style:0,平均透明 1,线状透明 2,圆形透明 3,菱形透明。

 

12、日志中插入背景图片代码:

       <TABLE align=center background="背景图" border=0 cellPadding=0

     cellSpacing=0 border Color=#ffff00 width="100%"><TBODY><TR>

     <TD> 内容,文字或图片..... </TD></TR></TBODY></TABLE>

 

13、图片的翻转代码:

(1)左右翻转:<img src="图片地址" style="filter:FlipH">

<div style="filter:FlipH ;width:宽;height:高"><img src="图片地址"></div>

代码实例:<div align=center><img

src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><div

style="filter:FlipH ;width:400;height:300"><img  

src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"></div>

(2)上下翻转:<img src="图片地址" style="filter:FlipV">

<div style="filter:FlipV ;width:宽

;height:高"><img src="图片地址"></div>

代码实例:<div align=center><img

src="http://img.blog.163.com/photo/OKoDJUsnieC-

_htRVI6pyg==/5635973458677635647.jpg"">

<div style="filter:FlipV ;width:400;height:313"><img

src="http://img.blog.163.com/photo/OKoDJUsnieC-_htRVI6pyg

==/5635973458677635647.jpg">

</div>  

(3)色彩反转:  <center><img src="图片网址" style="filter:invert"></center>

   14、 水波效果:(风吹)

  <center>

 <img src="图片网址" style="filter:wave(freq=11, strength=4, phase=6, lightstrength=10)"></center> 

15、.倒影效果

<font style="width:533;height:399">

<img src="图片地址"><font style="width:533;height:399;filter:wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()"><img src="图片地址"></font>  

16、图片水中倒影代码

<P><IMG src="图片地址" width="240" height="180"><BR><IMG id="reflection" src="图片地址" style="filter:wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()" width="240" height="180"></P> 

17、 波形效果代码


<div style="filter:Wave(freq=7,strength=9,lightstrength=5,phase=5);width:滤镜宽;height:滤镜高" align=center><br><img src="图片地址"></div>


 【代码说明】
(freq频率(>0)strength振幅强度(>0)lightstrength波峰强度(0~100愈高越黑)phase起始相位(0~100),滤镜宽=图宽+振幅强度×2,滤镜高=图高+振幅强度×2+10)

  

       18、图片透明代码

1)、<img src="图片地址" style="filter:Alpha(opacity=100,finishOpacity=0,style=0)">

2)、<div style="filter:Alpha(opacity=100,finishOpacity=0,style=0) ;width:宽;height:高"><img src="图片地址"></div>

【代码说明】涉及到的属性:修改数值对应即可

opacity:开始处的透明度

finishOpacity:结束处的透明度

style:0,平均透明 1,线状透明 2,圆形透明 3,菱形透明

       19、X光效果代码


1)<img src="图片地址" style="filter:Xray">

2)<div style="filter:Xray ;width:宽;height:高"><img src="图片地址"></div>

 20、图片的平铺(无缝连接)

<P align=center><IMG src="图片地址" width=105><IMG src="图片地址" width=105><IMG src="图片地址" width=105><IMG src="图片地址" width=105></P>

注:width=105可以调整

效果:

图片特效、FLASH、3D相册代码 - 梦中人  - 梦中人の梦工场图片特效、FLASH、3D相册代码 - 梦中人  - 梦中人の梦工场图片特效、FLASH、3D相册代码 - 梦中人  - 梦中人の梦工场图片特效、FLASH、3D相册代码 - 梦中人  - 梦中人の梦工场

二、图片移动代码

1.向左移动 代码:

<marquee scrollamount=1 scrolldelay=3 valign=middle behavior="scroll">

<img border="0" src="

http://img.bimg.126.net/photo/uru9ytC86wKpeUsqtG2JdA

==/2012264608505334824.jpg"width=220 height=280>

<img border="0" src="

http://img.bimg.126.net/photo/Pel3OoE6weQoTBYoI-ShOw

==/4587760645407682725.jpg"width=220 height=280> 

<img border="0" src="

http://img.bimg.126.net/photo/Pel3OoE6weQoTBYoI-ShOw

==/4587760645407682725.jpg"width=220 height=280

</marquee>

注:这里增加了宽和高的控制代码,width=220 height=280  

2、向右移动

<marquee direction=right> <img border="0"src=" 

 http://img.bimg.126.net/photo/ch6UGzaL0wSdp6e4anBZwA

==/4835740099889524772.jpg">

 <img border="0"src="

http://img.bimg.126.net/photo/Pel3OoE6weQoTBYoI-ShOw

==/4587760645407682725.jpg "> </font></marquee>

3、向下移动:

<marquee direction=down scrollamount=5><center>

<font color=0000ff size=5 face=华文行楷><b>向下移动</b></font><br>

<img src=

"http://img.bimg.126.net/photo/ch6UGzaL0wSdp6e4anBZwA

==/4835740099889524772.jpg"  width=90 height=90></marquee>

4、来回移动

<marquee width=100% behavior=alternate scrollamount=10><img src=

http://img.bimg.126.net/photo/ch6UGzaL0wSdp6e4anBZwA

==/4835740099889524772.jpg

</font></marquee>

5、加图片的友情链接代码

<marquee behavior="scroll" direction=right width="100%" height="100"

scrollamount="2" scrolldelay="30" ><a target="cont" href="对方地址">

<img src="对方图片" width="100" height="100" border="0"></a>

<a target="cont" href="对方地址"><img src="对方图片" width="100" height="100"

border="0"></a><a target="cont" href="对方地址"><img src="对方图片"

width="100" height="100" border="0"></a><a target="cont" href="对方地址">

<img src="对方图片" width="100" height="100" border="0"></a>

<a target="cont" href="对方地址"><img src="对方图片" width="100" height="100"

border="0"></a><a target="cont" href="对方地址"><img src="对方图片"

 width="100" height="100" border="0"></a>

<a target="cont" href="对方地址"><img src="对方图片" width="100" height="100"

border="0"></a></marquee> 

6.从下往上滚动代码:

<marquee align=center direction=up scrollamount=1 scrolldelay=3 valign=middle

behavior="scroll">

<img border="0" src=" http://img.bimg.126.net/photo/zLZSw_yU5XsJtoRbNw-LAw

==/1474928877964258075.jpg">

<img border="0" src=" http://img.bimg.126.net/photo/zLZSw_yU5XsJtoRbNw-LAw

==/1474928877964258075.jpg">

</marquee>

7、从上下向中间移动代码:

 <DIV align=center> <MARQUEE scrollAmount=2 direction=down><IMG

src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

 <IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

</MARQUEE> <MARQUEE style=" FILTER: flipv(enabled=1)"

 scrollAmount=2 direction=down>

 <DIV alig=center>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

 <IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

 <IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br></DIV>

</MARQUEE>

 

8、从中间向上下移动代码:

<DIV align=center> <MARQUEE scrollAmount=2 direction=up><DIV align=center>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG src=“http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg“><br><br> <IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br></DIV>

</MARQUEE> <MARQUEE style="FILTER: flipv(enabled=1)" scrollAmount=2

direction=up> <DIV align=center>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

 <IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

 <IMG src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br>

<IMG   src="http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"><br><br></DIV>

</MARQUEE> 

9、对开移动代码

<TABLE cellSpacing=0 cellPadding=0 width=500 align=center border=0>

<TBODY>

<TR> <TD align=middle> <MARQUEE scrollAmount=1  

scrollDelay=100  direction=right width=120><IMG src="

http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg"> </MARQUEE></TD>

<TD align=middle> <MARQUEE scrollAmount=1

scrollDelay=100 width=120><IMG src="

http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg">

</MARQUEE></TD>

 <TD align=middle> <MARQUEE scrollAmount=1

 scrollDelay=100 direction=right width=120><IMG src="

http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg==/22

54896038429471197.jpg">

</MARQUEE></TD>

<TD align=middle> <MARQUEE scrollAmount=1

 scrollDelay=100 width=120><IMG src="

http://img.bimg.126.net/photo/kN1qKB3eNmMSkYBM1ftVhg

==/2254896038429471197.jpg">

</MARQUEE></TD></TR>

10、 图片上加飘动文字特效代码

 

<table align=center border=3 bordercolor="#CD5C5C" width=550  

height=350>

<td background=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg>

<marquee behavior=alternate scrollamount=3 direction=down height=350>

<marquee behavior=alternate scrollamount=3 width=500><img src=1.gif>

<font color=red size=6><b>请输入你想要的文字</b><img src=1.gif></font>

</marquee></table><br>

 

11、移动的朦胧图片代码

1)圆形左右移动

<P align=center>
<MARQUEE scrollAmount=3 behavior=alternate>
<TABLE>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity='95',style='2')" width=420 background=

http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg 

height=266></TD></TR></TBODY></TABLE>

</MARQUEE></P>

2)圆形向左移动

<MARQUEE scrollAmount=3 behavior='="scroll"'>
<TABLE>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity='95',style='2')" width=420 background=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg height=266></TD></TR></TBODY></TABLE></MARQUEE>

3)圆形向右移动

 <MARQUEE scrollAmount=3 direction=right >
<TABLE>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity='95',style='2')" width=420 background=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg height=266></TD></TR></TBODY></TABLE></MARQUEE>

4)方形向上移动

 <MARQUEE scrollAmount=3 direction=up behavior='="scroll"'>
<TABLE>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity='95',style='3')" width=420 background=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg height=266></TD></TR></TBODY></TABLE></MARQUEE>

提示:

="up"表示向上  ="down"表示向下   ="left"表示向左  ="right"表示向右 可以随意更改

height=150你可以根据图片大小来设置合适的数值

scrolldely="10"移动速度 写入的数字越大速度越快

style=1或2或3,如果是4,那就没有效果了

12、中间向两边移动:

 

 

 

<center><br><marquee width=220 height=350><img   src=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg width=290 height=150></marquee>
<marquee  direction=right width=220 height=350><img   src=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg width=290 height=150> </marquee>

 

13、图片全屏移动代码:

 <DIV style="LEFT: -220px; WIDTH: 1200px; POSITION: relative; TOP: 70px">
<MARQUEE><INPUT type=image height=600 width=1000 src="
http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg"> <BR>
<DIV></DIV></MARQUEE><FONT style="FONT-SIZE: 0px"><BR></DIV></FONT>
<DIV></DIV><BR><BR></DIV>
<P></P>

14、图片走走停停(无缝连接)

<MARQUEE scrollAmount=3 behavior=alternate width=100%><MARQUEE scrollAmount=3 width=96%>
<IMG src="
http://www.616bbs.com/picture/xx9/hs/73.jpg"><IMG src="http://www.616bbs.com/picture/xx9/hs/175.jpg"><IMG src="http://www.616bbs.com/picture/xx9/hs/216.jpg">
</MARQUEE></MARQUEE>

15、图片的无缝拼接代码

 <TABLE height=2000 cellSpacing=0 cellPadding=0 width=500 align=center border=0>
<TBODY>

<TR><TD><IMG height=500 src="图片地址" width=500></TD></TR>

<TR><TD><IMG height=500 src="图片地址" width=500></TD></TR>

<TR><TD><IMG height=500 src="图片地址" width=500></TD></TR>

<TR><TD><IMG height=500 src="图片地址" width=500></TD></TR>

</TBODY></TABLE>

  可以根据图片的张数,随意增加<TR><TD><IMG height=500 src="图片地址" width=500></TD></TR>,当然增加后要修改最上面一行中的height=2000为实际值。


  16、图片加开门

<BR><BR>
<TABLE height=300 cellSpacing=0 cellPadding=0 width=300 align=center
background=http://bbs.xxjy.net/showimg.asp?BoardID=429&filename=2005-12/200512241736479683.jpg border=0>
<TBODY>
<TR>
<TD align=middle>
<TABLE cellSpacing=0 cellPadding=0 align=center border=0>
<TBODY>
<TR>
<TD align=middle>
<MARQUEE scrollAmount=3 behavior=slide width=300 height=289>
<MARQUEE scrollAmount=3 direction=right width=300 height=289>
<DIV align=center>
<TABLE style="FILTER: revealTrans progid:DXImageTransform.Microsoft.gradient
(gradientType=1,startColorstr=green, endColorstr=red)" height=300

cellSpacing=0 cellPadding=0 width=300 align=center border=0> <TBODY>
<TR>
<TD style="FILTER: chroma(color=#0000FF)">
<DIV style="FILTER: glow(color=yellow strength=6); WIDTH: 100%; COLOR: #ff00ff"><FONT size=7><STRONG><FONT face=华文新魏>
<P align=center><FONT style="FONT-SIZE: 85pt; FONT-FAMILY: 华文新魏" color=#ff00ff><B>你好</B></FONT></P></FONT></FONT>
<P></P></FONT></STRONG></FONT></DIV></TD></TR></TBODY>

</TABLE></DIV></MARQUEE></MARQUEE></TD>
<TD>
<MARQUEE scrollAmount=3 direction=right behavior=slide width=300 height=300>
<MARQUEE scrollAmount=3 width=300 height=300>
<DIV align=center>
<TABLE style="FILTER: revealTrans progid:DXImageTransform.Microsoft.gradient(gradientType=1,startColorstr=red, endColorstr=green)" height=300 cellSpacing=0 cellPadding=0 width=300 align=center border=0>
<TBODY>
<TR>
<TD style="FILTER: chroma(color=#0000FF)">
<DIV style="FILTER: glow(color=yellow strength=6); WIDTH: 100%; COLOR: #ff00ff">
<P align=center><FONT style="FONT-SIZE: 85pt; FONT-FAMILY: 华文新魏" color=#ff00ff><B>你好</B></FONT></P></FONT></STRONG>
<P></P></DIV></TD></TR></TBODY></TABLE></DIV></MARQUEE>

</MARQUEE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

<BR> <DIV></DIV>

注: 各参数详解:

a)scrollAmount。它表示速度,值越大速度越快。如果没有它,默认为6,

建议设为1~3比较好。

b)width和height,表示滚动区域的大小,width是宽度,height是高度。

特别是在做垂直滚动的时候,一定要设height的值。

c)direction。表示滚动的方向,默认为从右向左:←←←。可选的值有right、down、up。滚动方向分别为:right表示→→→,up表示↑,down表示↓。

d)scrollDelay,这也是用来控制速度的,默认为90,值越大,速度越慢。

通常scrollDelay是不需要设置的。

e)behavior。用它来控制属性,默认为循环滚动,可选的值有alternate(交替滚动)、slide(幻灯片效果,指的是滚动一次,然后停止滚动)

18、窗帘效果

<P align=center>
<TABLE cellSpacing=10 cellPadding=0 width="70%" align=center background=http://bbs.xxjy.net/UploadFile/2005-4/200541782037526.jpg border=1>
<TBODY><TR><TD>
<TABLE cellSpacing=10 cellPadding=0 width="100%" align=center background=http://www.whdjdybbs.com/bbs/UploadFile/2004-11/20041122102033452.jpg border=1>
<TBODY><TR><TD>
<TABLE height=510 cellSpacing=0 cellPadding=20 width=660 align=center background=http://bbs.xxjy.net/UploadFile/2005-5/200552393334618.jpg border=1><TBODY><TR>
<TD><EMBED align=right src=http://youngcolor.com.ne.kr/swf1/38.swf width=660 height=510

type=application/x-shockwave-flash quality="high" wmode="transparent">

</EMBED><EMBED align=right src=http://mtv.vicn.com/upload/2004482345353317.swf width=660

height=510 type=application/x-shockwave-flash quality="high" wmode="transparent"></EMBED> </TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>

19图片上面加滚动字

<CENTER><TABLE cellSpacing=15 cellPadding=5 width=550 align=center

background=http://www.yyly8.com/UploadFile/2005-12/20051219155565535.gif border=15 table>
<TBODY><TR><TD><P><P>
<MARQUEE scrollAmount=2 direction=up height=395><B>
<CENTER><FONT size=5><FONT color=#ff1493>岁月悠悠,<BR>时光如流,<BR>又一个圣诞节,

<BR>又一段幸福时光,<BR>又一次真诚祝福,<BR>今天是我朋友的生日,<BR>飘送着的祝福<BR>

萦绕在您的身边<BR>愿这美丽的鲜花<BR>带着最美好的祝愿<BR>祝您生日快乐!<BR>永远快乐!<BR>0000</FONT></FONT></CENTER></B></MARQUEE></P></TD></TR></TBODY></TABLE></CENTER>

20、图片透过文字移动


<DIV style="POSITION: absolute; TOP: 50px; LEFT: 0px">
<CENTER>
<MARQUEE>
<P align=center><IMG style="FILTER: alpha(opacity=200,style=2); MARGIN: 0px 0px 0px 10px; WIDTH: 600px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: none; HEIGHT: 360px; cssfloat: none" title="" alt="" src="http://img0.ph.126.net/xOyz9P2nds6i9IUzHKqeGw==/1074671461099170270.jpg" width=0 eventsListUID="e4" quoteTimer="0"></P></MARQUEE></CENTER></DIV>

三、给日志用图片作封面的技术

将日记写完未发表前,在面板下面点击《其他设置》,在出现的《摘要》里(大方框中)将下面的代码粘贴进去:

<A href="该篇日记的地址" target=_blank><IMG  src="要使用的图片的地址" ></A>

1.用你的日记地址替换代码中的该篇日记的地址;用图片地址替换要使用的图片的地址。

2.该篇日记的地址要在日记发表后才能取得,在你的电脑最上面的地址栏中;

3.图片地址的取得,选中你要用的图片用右键点击图片,在弹出框中点击属性,

在新的弹出框中的地址栏里面复制地址。回来将地址粘贴到【要使用的图片的地址】上。

4.发表日记该图片就会在首页显示。

四、贴flash的实用代码

1、贴flash基础代码1: <embed src="flash地址" width="宽度" height="高度">

(1)非透明动画代码: 

 <EMBED src=FLASH动画地址 width=600 height=420 type=application/x-shockwave-flash quality="high" >  (width、 height 宽度和高度值是可改变 )
        (2)透明动画代码:

<EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=FLASH动画地址 width=200 height=200 type=application/x-shockwave-flash wmode="transparent" quality="high" >  

插入单张flash实例:

<EMBED align=center src=http://imgfree.21cn.com/free/flash/131.swf width=400 height=300 type=application/octet-stream wmode="transparent" quality="high" >

贴Flash基础代码2:

<TABLE align=center><EMBED src=Flash动画地址 width=500 height=400 type=application/x-shockwave-flash wmode="transparent"></EMBED></TABLE>

贴Flash基础代码3:

实例:<P ><EMBED height=550 type=application/x-shockwave-flash pluginspage=http://www.macromedia.com/go/getflashplayer width=650 src=http://webftp.bbs.hnol.net/shuchang/015fengye/09122019306376538d1ab1432c.swf  allowScriptAccess="never" allowNetworking="internal" quality="high" wmode="transparent">"></EMBED></P> 

效果 :

2、加边框贴flash的代码

 
<TABLE height=400 cellSpacing=0 cellPadding=0 width=500 background=http://olcf.16789.net/domName/olcf/200642812224314758.jpg

border=1 bortercolor="#000000">

<TBODY>

<TR>

<TD>

<P align=center><EMBED src= http://xuanfei.cctv118.com/2009fla/161.swf   width=500 height=380 type=application/x- tybe="application/x-shockwave-flash" quality="high" menu="false" wmode="transparent" shockwave-flash> </P></TD></TR></TBODY></TABLE>

 

3、图片做背景+FLASH

 

1)、没有边框的一张图片加一个FLASH动画

<P align=center>
<TABLE height=323(图片高度) cellSpacing=0 width=400 (图片宽度)background=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg(图片地址) border=0(边框的宽度)>
<TBODY>
<TR>
<TD><EMBED src=http://imgfree.21cn.com/free/flash/51.swf(特效地址) width=400(特效宽度) height=323 type=application/x-shockwave-flash quality="high" wmode="transparent"></EMBED></TD></TR></TBODY></TABLE></P>

如果将border=0给了数字,那么显示边框的宽度

2) 、加框有一层FLASH的图片
<TABLE height=400 cellSpacing=0 cellPadding=0 width=600

 background=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg

 border=1 bortercolor="#000000"><TBODY><TR><TD>
<P align=center><EMBED src=http://imgfree.21cn.com/free/flash/4.swf width=400 height=300  type=application/x-G

shockwave-flash wmode="transparent" menu="false" quality="high" tybe="application/x-shockwave-flash">

</P></TD></TR></TBODY></TABLE>

 

3)、加框用两层FLASH的图片
<P align=center>
<TABLE height=400 cellSpacing=0 cellPadding=0 width=600

background=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg
 border=1 bortercolor="#000000"><TBODY><TR><TD><P align=center>

<EMBED align=right src=http://imgfree.21cn.com/free/flash/4.swf width=400 height=280

type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high"

tybe="application/x-shockwave-

flash"> <BR><BR><EMBED align=right src=http://imgfree.21cn.com/free/flash/33.swf width=380

height=285

type=application/x-shockwave-flash wmode="transparent" menu="false" quality="high"

tybe="application/x-shockwave-

flash"> <BR></P></TD></TR></TBODY></TABLE>

 

     4、图片加3层flash的代码实例

<TBODY>
<TR>
<TD>
<TABLE cellSpacing=6 width=6 align=center>
<TBODY>
<TR>
<TD>
<P style="TEXT-INDENT: 2em" align=center>
<TABLE border=0>
<TBODY>
<TR>
<TD width=580 background=http://img8.bimg.126.net/photo/lPBnWjJve6T31EIikEw3-A==/2325546257584720989.jpg  
 height=350>
<P></P>
<P style="TEXT-INDENT: 2em"><EMBED style="FLOAT: right " align=right  src=http://xuanfei.cctv118.com/2009fla/161.swf width=100 height=100 type=application/octet-stream quality="high" wmode="transparent"></EMBED> <EMBED align=right src=http://imgfree.21cn.com/free/flash/16.swf width=580 height=300 type=application/octet-stream quality="high" wmode="transparent"></EMBED> <EMBED style="DISPLAY: block; TEXT-ALIGN: center" align=right src=http://webftp.bbs.hnol.net/shuchang/015fengye/09122019306376538d1ab1432c.swf width=580 height=300 type=application/octet-stream quality="high" wmode="transparent"></EMBED></P></TD></TR></TBODY></TABLE></P></TD></TR></TBODY></TABLE>
效果:

给图片加多层FLASH特效代码说明

 <P align=center><TABLE height=表格高度 cellSpacing=0 cellPadding=0 width=宽度 background=图片地址 border=0>
<TBODY><TR><TD><EMBED align=right src=第一个FLASH地址 width=宽 height=高 type=application/octet-stream wmode="transparent" quality="high" ;;><EMBED align=right src=第二个地址 width=400 height=300 type=application/octet-stream wmode="transparent" quality="high" ;;>.......以此类推</EMBED></TD></TR></TBODY></TABLE></P>

5、朦胧图片加flash

<TABLE align=center border=0>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity=100,style=2)" width=420 background=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg height=266>
<P align=center><EMBED src=http://imgfree.21cn.com/free/flash/33.swf width=420 height=266 type=application/x-shockwave-flash quality="high" wmode="transparent"></P></TD></TR></TBODY></TABLE>

6、FLASH羽化代码:

<P align=center><EMBED style="DISPLAY: block; FILTER: Alpha(opacity=100,style=2)" src=FLASH地址 width=700 height=400 type=application/x-shockwave-flash loop="0" wmode="transparent"></EMBED></P>

 提示:1、style=2时为四边形;2、style=3时为圆形。

  

 7图片加透明FLASH加移动的文字

<P align=center><TABLE height=350 cellSpacing=3 borderColorDark=#fff000 cellPadding=0 width=500 borderColorLight=#fff000 background=http://www.ruiheda.com/bbs/UploadFile/2005-12/2005123121365067340.jpg border=12><TBODY><TR><TD><EMBED

align=right src=http://s5.edmin.cn/a/eadd996d8be6bb3a2af6849c5bc5e557.swf width=500 height=350 type=application/octet-stream wmode="transparent" quality="high" ;;> <BR><P align=center><MARQUEE scrollAmount=2 direction=up width=500 height=250><CENTER><FONT face=隶书 color=#ff00ff size=6>祝新年快乐!<BR><BR></FONT></CENTER></MARQUEE></P></TD></TR>

</TBODY></TABLE>

五、图片上写文章的代码

<div align="center"><div style="background-image: url('图片地址'); background-repeat: repeat; background-attachment: scroll; font-style: normal; font-variant: normal; font-weight: normal; line-height: 25px; font-size: 12px; font-family: verdana; width: 490px; height: 268px; padding-left: 10px; padding-right: 0px; padding-top: 14px; background-"><br /><div align="left">

<div style="PADDING-RIGHT: 0px; PADDING-LEFT: 10px; FILTER: alpha(opacity=60); WIDTH: 400px; HEIGHT: 228px">文字内容</div></div><br /></div></div>

将代码中的图片地址换为你想要的图片

文字内容那里更换为你想要写的东西。

 六、透明3D相册代码

1、拼图相册代码

<P align=center>

<EMBED pluginspage=http://www.macromedia.com/go/getflashplayer align=middle

src=http://flash.picturetrail.com/pflicks/l_puzzle_r.swf width=485 height=400

 type=application/x-shockwave-flash

allowNetworking="internal" bgcolor="#ffffff" wmode="transparent" FlashVars="logopath=http://flash.picturetrail.com/pflicks/ptlogo1.swf&

amp;ptdim=50.10&amp;ptxy=400.16&amp;auto=1&amp;wait=4&amp;img1=http://img8.bimg.126.net/photo/pyPvYt8hREpyML3WeWRtyw==/2327235107444348309.jpg&amp;img2=http://img8.bimg.126.net/photo/i81CULrUBNnx8tv7YKN_5Q==/2327235107444348334.jpg
&amp;img3=http://img.bimg.126.net/photo/gFBTfwOZvlQVoEqI4sAwDg==/642888846807641769.jpg&amp;img4=http://img9.bimg.126.net/photo/mBkFsRETarnt5EC4UHEp2Q==/2581688486391440548.jpg&amp;img5=http://img46.bimg.126.net/photo/lKpGmU81y9pJi4Qfk80NAA==/627407723088555917.jpg&amp;img6=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg
&amp;test=1"

 wmode="transparent" bgcolor="#ffffff"></EMBED>

效果: 

2、透明宝镜相册代码

<P align=center>

<EMBED pluginspage=http://www.macromedia.com/go/getflashplayer align=middle

src=http://flash.picturetrail.com/pflicks/lenssoft_r.swf width=385 height=385

type=application/x-shockwave-flash

loop="false" quality="high" FlashVars="logopath=http://flash.picturetrail.com/pflicks/ptlogo1.swf

&amp;ptdim=50.10&amp;ptxy=300.16&amp;mute=1&amp;wait=4&amp;img1=http://img8.bimg.126.net/photo/pyPvYt8hREpyML3WeWRtyw==/2327235107444348309.jpg&amp;img2=http://img8.bimg.126.net/photo/i81CULrUBNnx8tv7YKN_5Q==/2327235107444348334.jpg
&amp;img3=http://img.bimg.126.net/photo/gFBTfwOZvlQVoEqI4sAwDg==/642888846807641769.jpg&amp;img4=http://img9.bimg.126.net/photo/mBkFsRETarnt5EC4UHEp2Q==/2581688486391440548.jpg&amp;img5=http://img46.bimg.126.net/photo/lKpGmU81y9pJi4Qfk80NAA==/627407723088555917.jpg&amp;img6=http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg
&amp;test=1" wmode="transparent" bgcolor="#ffffff"></EMBED>

 效果:

 

3、幻灯片相册代码 
<DIV align=center>
<TABLE cellSpacing=3 borderColor=#990e04 cellPadding=4 width=431 bgColor=#990033 align=center>
<TBODY>
<TR borderColorLight=#2a404b borderColorDark=#fffff0>
<TD colSpan=2>
<TABLE border=0 cellSpacing=0 borderColor=white cellPadding=0 width=400 bgColor=#990033>
<TBODY>
<TR>
<TD>
<P align=center><EMBED height=320 type=application/x-shockwave-flash pluginspage=http://www.macromedia.com/go/getflashplayer width=400 src=http://st.blog.163.com/bin/pixviewer.swf wmode="transparent" invokeurls="false" quality="high" flashvars="pics=http://img8.bimg.126.net/photo/pyPvYt8hREpyML3WeWRtyw==/2327235107444348309.jpg|http://img8.bimg.126.net/photo/i81CULrUBNnx8tv7YKN_5Q==/2327235107444348334.jpg|http://img.bimg.126.net/photo/p8hJSycQMNxb9xKy87DZgw==/3427802266382843879.jpg|http://img.bimg.126.net/photo/cuzLWg88vnyeoCHQ9soF6Q==/5408823152472239842.jpg|http://img.bimg.126.net/photo/Nk49oLYyCnTt-XcT8aVOOA==/5408823152472239836.jpg|http://img8.bimg.126.net/photo/ig1FwWx60vq197jaRJxcFw==/2325546257584720988.jpg&amp;links=0&amp;texts=0&amp;borderwidth=400&amp;borderheight=320&amp;textheight=0"> </P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV>

效果

 

4、透明立方体相册代码

<P align=center>

<EMBED pluginspage=http://www.macromedia.com/go/getflashplayer align=middle

src=http://flash.picturetrail.com/pflicks/acrobatcube_r.swf width=425 height=425

type=application/x-shockwave-flash loop="false" quality="high" FlashVars="backopacity=100&amp;cubecroptofit=1&amp;enlargecroptofit=0&amp;

logopath=http://flash.picturetrail.com/pflicks/ptlogo1.swf

&amp;ptdim=50.10

&amp;ptxy=300.16&amp;faceopacity=80&amp;img1=图片地址&amp;img2=图片地址

&amp;img3=图片地址&amp;img4=图片地址&amp;img5=图片地址&amp;img6=图片地址

&amp;test=1" wmode="transparent" bgcolor="#ffffff"></EMBED>

效果:

 

您在这里已经停留了

2009年6月8日 - 梦中人 - 梦中人の梦工场 2009年6月8日 - 梦中人 - 梦中人の梦工场 2009年6月8日 - 梦中人 - 梦中人の梦工场 2009年6月8日 - 梦中人 - 梦中人の梦工场 2009年6月8日 - 梦中人 - 梦中人の梦工场 

       返回首页        下一页      博客素材和实用代码汇总      更多实用博客代码    

       博客技巧、素材、和现成精品代码              代码效果在线运行检测


  评论这张
 
阅读(41818)| 评论(90)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017