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

.

.

 
 
 

日志

 
 

用(静态)图片制作边框的方法  

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

  下载LOFTER 我的照片书  |

 

 
用(静态)图片制作边框的方法 - 寒冬腊月 - .
 
将向博客新手详细解讲制作过程
撰文:寒冬腊月 

用(静态)图片制作边框的方法 - 寒冬腊月 - .

用(静态)图片制作边框的方法 - 寒冬腊月 - .

用(静态)图片制作边框的方法 - 寒冬腊月 - .

边框的制作方法,一般分为二种:

1):用代码(不用图片)直接制作音画、日志的边框;

2):用代码加图片地址的方法,来制作更加漂亮的日志及音画边框.

用(静态)图片制作边框的方法 - 寒冬腊月 - .

    通常情况下,大多数博友均采用第二种方法.特点是美观、漂亮.但制作过程相对复杂一些.今天,本人特地抽出时间赶写了这方面的资料供大家叁考.并借此回复各位博友的留言......

静态图片边框的制作方法(纯色静态图片)

为了更简单、直观地讲解其操作过程.我特以棕、兰、红、绿、黑、黄和粉红色,七种颜色纯色静态图片为素材进行演示.(可以先点击下面七个图片地址查看一下)

                          用(静态)图片制作边框的方法 - 寒冬腊月 - .  用(静态)图片制作边框的方法 - 寒冬腊月 - .    用(静态)图片制作边框的方法 - 寒冬腊月 - .    用(静态)图片制作边框的方法 - 寒冬腊月 - .    用(静态)图片制作边框的方法 - 寒冬腊月 - .    用(静态)图片制作边框的方法 - 寒冬腊月 - .    用(静态)图片制作边框的方法 - 寒冬腊月 - .

 两组Flash动画图片地址查阅:

<1> http://myhome.naver.net/brown444/swish/s80-m.swf

<2> http://imgfree.21cn.com/free/flash/7.swf

一、单层图片边框代码:

<TABLE cellSpacing=4 width=700 align=center background=http://img.blog.163.com/photo/bYG1_YlCT1zMFHQ1kab7QQ==/5713097602296912568.jpg border=2>
<TBODY>
<TR>
<TD>填写内容 </TD></TR></TBODY></TABLE>

 效果图如下:

填写内容

说明:

1):面代码中的 cellSpacing=4 表示最内层白色边框与兰色图片边缘间的距离;width=700 表示该边框的宽度,最大宽度不超过700;align=center 表示该边框在日志中居中的位置,只有在边框宽度小于700时才能见到效果;background=图片地址;border=2表示最外层白色边框的粗细度.

2):如将上述cellSpacing=4 、width=700 、border=2中的数据值修改为:cellSpacing=14 、width=400 、border=6后,则该边框显示为如下图:

填写内容

3):如果将上面代码中的border=6的数值改为0;在边框宽度width=400 或更小数值时,改变边框靠日志页面左侧或右侧时,只需将align=center (居中)变为align=left(左)或align=right(右)即可.改变上述数值后,

         该边框显示为如下图:

填写内容

 

 

              用同样的方法来制作:

  二、多层图片边框代码:

(一)、先讲两层图片边框。该效果图,是红和兰色纯图片组成的。

最基本代码为:

<TABLE cellSpacing=16 width=600 align=center background=http://img.blog.163.com/photo/ijTm-mrnsRPS0AHzYNyWuQ==/5713097602296912572.jpg >
<TBODY>
<TR>
<TD>
<TABLE  width=700 align=center background=http://img.blog.163.com/photo/bYG1_YlCT1zMFHQ1kab7QQ==/5713097602296912568.jpg >
<TBODY>
<TR>
<TD>填写内容 </TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

看效果图如下:

填写内容

 说明:如果将上述代码中添加进cellSpacing=6、border=4代码后,该二层边框则显示为如下图:

 <TABLE cellSpacing=16 cellPadding=20 width=700 align=center background=http://img.blog.163.com/photo/ijTm-mrnsRPS0AHzYNyWuQ==/5713097602296912572.jpg border=4>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=6 cellPadding=20 width=700 align=center background=http://img.blog.163.com/photo/bYG1_YlCT1zMFHQ1kab7QQ==/5713097602296912568.jpg border=4>
<TBODY>
<TR>
<TD>填写内容 </TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

  

填写内容

(二)、三层图片边框.该效果图,是绿色纯图片组成的。

代码复制区:

<TABLE cellSpacing=10 cellPadding=20 width=600 align=center background=http://img.blog.163.com/photo/ijTm-mrnsRPS0AHzYNyWuQ==/5713097602296912572.jpg border=2>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#00000 cellSpacing=10 cellPadding=20 width=600 align=center background=
http://img.blog.163.com/photo/bYG1_YlCT1zMFHQ1kab7QQ==/5713097602296912568.jpg
border=2>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#0000ff cellSpacing=10 cellPadding=20 width=600 align=center background=
http://img.blog.163.com/photo/pL4RDa6jcV-l-gwGGNwvlA==/5713097602296912570.jpg
border=2>
<TBODY>
<TR>
<TD>
填写内容 </TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR>

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

看效果图如下:

填写内容

用同样的方法:

你可以做四、五甚至更多层边框了.这里关键是撑握代码灵活运用,知道如何修改代码中的部分数值,从而改变边框的构成.

讲道这儿,你也已经对用图片来做边框的方法有所了解. 下面再附四、五及七层图片边框的效果图供叁考...

四层图片边框效果图:

填写内容

 

五层图片边框效果图:

填写内容

七层图片边框效果图:

填写内容

下一讲中,将讲解: 怎样用动、静态图片组合制作边框的方法

  用(静态)图片制作边框的方法 - 寒冬腊月 - .  点击进入   动、静态图片组合制作边框

用(静态)图片制作边框的方法 - 寒冬腊月 - .

用(静态)图片制作边框的方法 - 寒冬腊月 - .

用(静态)图片制作边框的方法 - 寒冬腊月 - .

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

用(静态)图片制作边框的方法 - 寒冬腊月 - .

用(静态)图片制作边框的方法 - 寒冬腊月 - .

   

用(静态)图片制作边框的方法 - 寒冬腊月 - .

 

用(静态)图片制作边框的方法 - 寒冬腊月 - .

用(静态)图片制作边框的方法 - 寒冬腊月 - .

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

 用(静态)图片制作边框的方法 - 寒冬腊月 - .

   用(静态)图片制作边框的方法 - 寒冬腊月 - .  点击进入   在我的博客,更多精彩等着你!

用(静态)图片制作边框的方法 - 寒冬腊月 - .

 

用(静态)图片制作边框的方法 - 寒冬腊月 - .

 

  评论这张
 
阅读(2425)| 评论(6)
推荐 转载

历史上的今天

评论

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

页脚

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