青海省经信委网站:用(静态)图片制作边框的方法

2008-05-15 08:11:30|  分类：边框的制作 |  标签： |字号大中小
 

将向博客新手详细解讲制作过程
http://hdly006502.blog.163.com.
撰文：寒冬腊月



边框的制作方法,一般分为二种:
1):用代码(不用图片)直接制作音画、日志的边框;
2):用代码加图片地址的方法,来制作更加漂亮的日志及音画边框.

通常情况下,大多数博友均采用第二种方法.特点是美观、漂亮.但制作过程相对复杂一些.今天,本人特地抽出时间赶写了这方面的资料供大家叁考.并借此回复各位博友的留言......
静态图片边框的制作方法(纯色静态图片)
为了更简单、直观地讲解其操作过程.我特以棕、兰、红、绿、黑、黄和粉红色,七种颜色纯色静态图片为素材进行演示.(可以先点击下面七个图片地址查看一下)
                 
七种颜色的图片地址如下:
<1> 棕色http://image35.360doc.com/DownloadImg/2011/09/0421/17037529_32.jpg
<2>兰色http://image35.360doc.com/DownloadImg/2011/09/0421/17037529_29.jpg
<3>红色http://image35.360doc.com/DownloadImg/2011/09/0421/17037529_30.jpg
<4>绿色http://image35.360doc.com/DownloadImg/2011/09/0421/17037529_31.jpg
<5>黑色http://image35.360doc.com/DownloadImg/2011/09/0421/17037529_33.jpg
<6>黄色http://image35.360doc.com/DownloadImg/2011/09/0421/17037529_34.jpg
<7>粉红http://image35.360doc.com/DownloadImg/2011/09/0421/17037529_35.jpg
两组Flash动画图片地址查阅:
<1>http://myhome.naver.net/brown444/swish/s80-m.swf
<2>http://imgfree.21cn.com/free/flash/7.swf
一、单层图片边框代码:

填写内容

效果图如下:
填写内容
说明:
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(右)即可.改变上述数值后,
该边框显示为如下图: 填写内容
用同样的方法来制作:
二、多层图片边框代码:
(一)、先讲两层图片边框。该效果图,是红和兰色纯图片组成的。
最基本代码为:

填写内容

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

填写内容

填写内容
(二)、三层图片边框.该效果图,是红、兰和绿色纯图片组成的。
代码复制区:

填写内容

看效果图如下:
填写内容
用同样的方法:
你可以做四、五甚至更多层边框了.这里关键是撑握代码灵活运用,知道如何修改代码中的部分数值,从而改变边框的构成.
讲道这儿,你也已经对用图片来做边框的方法有所了解. 下面再附四、五及七层图片边框的效果图供叁考...
四层图片边框效果图:
填写内容
 
五层图片边框效果图:
填写内容
七层图片边框效果图:
填写内容
下一讲中,将讲解: 怎样用动、静态图片组合制作边框的方法
  点击进入 → 用动、静态图片组合制作边框



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



 




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

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


 
评论这张
转发至微博
转发至微博
1人  |  分享到：
阅读(1428)| 评论(3)| 引用 (15) |举报