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

.

.

 
 
 

日志

 
 

如何用动、静态图片组合制作漂亮的边框?  

2008-05-15 08:17:38|  分类: 边框的制作 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

 

 

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .
 
将向博客新手详细解讲制作过程
撰文:寒冬腊月 

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

 

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

 

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

          制作这类边框的方法和静态边框的制方法是完全相同的.但要想制作好这种边框,关键是素材的选用.以及怎样将动、静态图片组合?怎样搭配它们之间的颜色?等等...相对来说,其操作过程稍有难度.

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - . 

    下面本人仅以一张动态和五张静态图片构成的边框,来作简单讲解:先看下面的这六张图片:

         如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - . 如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - . 如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - . 如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - . 如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - . 如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

   以上六张图片地址分别为:

 <1>:http://img.blog.163.com/photo/AF-s9HYrWM638V9wcCKxHw==/895371900917079912.jpg

 <2>:http://img.blog.163.com/photo/-k5JatUg9d7tTmMUMOIkHg==/3969923071527466114.jpg

 <3>:http://img.blog.163.com/photo/lOyx9KRqNgYqJgmceWJg5A==/3969923071527466113.jpg

 <4>:http://img.blog.163.com/photo/4kprEaSP4i9To9yg2_TkOg==/4018336767521742745.jpg

 <5>:http://img.blog.163.com/photo/tH2J1CShwEsCvASxrneKQw==/5121718676227553127.jpg

 <6>:http://img.blog.163.com/photo/JB_kiOmrfwyxSRfA6v_TWg==/2298243184842961138.jpg

   原始代码:

<TABLE cellSpacing=6 cellPadding=0 width=700 align=center background=动态图片地址 border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=5 width=700 background=静态图片地址 border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=5 width=700 background=静态图片地址 border=0>
填写内容</TR></TBODY></TABLE></TR></TBODY></TABLE></TR></TBODY></TABLE>

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

   现将动态图片(第五张)来分别与另外五张静态图片做几种不同效果的搭配 .

 第一种效果,先用5、1张搭配,看它的效果图如下:(二层图片边框)

填写内容

第二种效果,先用5、3、2、张搭配,看它的效果图如下:(三层图片边框)

填写内容

 第三种效果,先用5、6、1张搭配,看它的效果图如下:(三层图片边框)

填写内容

 第四种效果,先用5、3、1、4张搭配,看它的效果图如下:(四层图片边框)

填写内容

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

 使用方法:

1):将选好的动、静态图片地址放在原始代码相应处即可;

2):如需制作多层边框,方法和静态图片多边框的制作方法相同;

3):内外边框的距离、各边框线的粗细、边框的宽度等.

  请叁见静态图片边框的制作方法一文.

下面是五层边框的复制代码:(可直接复制使用) 

<TABLE cellSpacing=15 cellPadding=0 width=600 align=center background=http://img.blog.163.com/photo/tH2J1CShwEsCvASxrneKQw==/5121718676227553127.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=6 width=600 background=http://img.blog.163.com/photo/lOyx9KRqNgYqJgmceWJg5A==/3969923071527466113.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=6 width=600 background=http://img.blog.163.com/photo/AF-s9HYrWM638V9wcCKxHw==/895371900917079912.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=6 width=600 background=http://img.blog.163.com/photo/-k5JatUg9d7tTmMUMOIkHg==/3969923071527466114.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=15 cellPadding=0 width=600 background=http://img.blog.163.com/photo/4kprEaSP4i9To9yg2_TkOg==/4018336767521742745.jpg border=0>
<TBODY>
<TR>
<TD>填写内容</TR></TBODY></TABLE></TR></TBODY></TABLE></TR></TBODY></TABLE>

    看它的效果图如下:

填写内容

 二、加框有一层FLASH的图片

代码复制区:

<P><BR>

<TABLE height=300 cellSpacing=0 cellPadding=0 width=500 background=

http://img.blog.163.com/photo/wZ3-cQGS6kzvLcPOZxRvJA==/5655676707047827078.jpg border=0>

<TBODY>

<TR>

<TD>

<EMBED align=right src=http://myhome.naver.net/brown444/swish/s80-m.swf width=500 height=210 type=application/x-shockwave-flash ; quality="high" wmode="transparent" allowNetworking="internal" allowScriptAccess="never">

<EMBED align=right src=http://imgfree.21cn.com/free/flash/7.swf  width=500 height=300 type=application/x-shockwave-flash ;; quality="high" wmode="transparent" ctet-stream allowNetworking="internal" allowScriptAccess="never"> </TD></TR></TBODY></TABLE></P>

<BLOCKQUOTE>

<P></P><EMBED src=http://www.shenxianggallery.com/media/yinyue.mp3 width=0 height=0 type=audio/mpeg autostart="true" loop="false" allowNetworking="internal" allowScriptAccess="never">

<DIV></DIV></BLOCKQUOTE>

  看效果图如下:

请点击查看影音文件...

请点击查看影音文件...

  三:图片倒影效果:

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .
如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

  使用代码如下:

<P align=center ><IMG  height=180 src="http://img.ph.126.net/paqw4TApN9FMj5quUZC7FQ==/3361937121833391270.jpg" width=240><BR><IMG id=reflection  style="FILTER: wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()" height=180  src="http://img.ph.126.net/paqw4TApN9FMj5quUZC7FQ==/3361937121833391270.jpg" width=240></P>

     四、加入背景音乐代码:

      效果图如下:

→ 代码复制区 :

<EMBED src=http://player.56.com/v_42784990.swf  width=200 height=200 type=audio/x-pn-realaudio-plugin controls="ImageWindow,ControlPanel,StatusBar" border="0" autostart="0" loop="0" invokeURLs="false" wmode="transparent" allowNetworking="internal" allowScriptAccess="never">

    具体操作方法,请参见我写的 〖如何做视频及动画的超链接〗一文;

    点击进入   如何做视频及动画的超链接?

  说明:

1、视频播放器尺寸的大小,应根据你网页页面的(即模块的大小)来决定;

2、上面代码中的蓝色处,即是视频播放器尺寸大小的数据,在实际操作中只要适当修改宽和高的数值即可;

3、有关这方的操作方法,请参见上面的"相关文章"链接; 

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

  ◇简单"边框"的制作方法◇  ◇"边框"的代码分析◇
  ◇如何不用图片做"边框"的方法◇  ◇用动、静态图片组合制作"边框"◇
  ◇用"静态"图片做"边框"的方法◇  ◇怎样给"图片"添加漂亮的"边框"◇
  ◇多层"边框"的添加方法◇  ◇如何改变"边框"中各边框线的粗细值◇
  ◇如何调整"边框"的宽度及高度◇  ◇怎样改变边框颜色及边框线数值◇
  ◇边框内层背景颜色的替换方法◇  ◇为你提供精美的"边框"及"边框"素材◇

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

   

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

 

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .
新手入门篇 文字类制作 图片类制作 日历、时钟制作
博客素材类 "边框"的制作 u5 教程 PS 教程
情感天地 生活常识 教子必读 音画欣赏
男人女人 测算运气 驾车技巧 幽默笑话
●新手入门篇●/●文字类制作●/●图片类制作●/●日历、时钟制作类●/●博客制作(素材类)●/●"边框"的制作●

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

     点击进入   在我的博客,更多精彩等着你!

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

 

如何用动、静态图片组合制作漂亮的边框? - 寒冬腊月 - .

  评论这张
 
阅读(4684)| 评论(16)
推荐 转载

历史上的今天

评论

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

页脚

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