青海省玉树县人民政府:如何给'图片'添加漂亮的边框?

来源:百度文库 编辑:九乡新闻网 时间:2024/03/29 14:56:09
如何给'图片'添加漂亮的边框?(原创)
2008-05-06 21:03:39|  分类:边框的制作 |  标签: |字号大中小

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



 
 
--------用代码为 "图片" 添加边框的方法---------

其实给'图片'加边框的方法有很多种,通常的方法:就是利图片处理软件来实
现.这也是很多博友都会做的.
那么,今天我特向大家介绍一种----用代码为"图片"添加边框的方法.虽然步
骤有点烦,但制作出来的边框也很漂亮哦!有兴趣的朋友,可以动手试一试...
下面,先让我们来它的效果图及复制代码:

1、单线边框:

代码复制区:

src="" target="_blank">http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg">


代码解析说明:
<1>、align=center,表示图片在页面中显示的位置居中,把'center'改成'right'表示居右;图片紧靠左边,只需把'center'改成'left'即可;
<2>、BORDER-RIGHT表示图片右侧边框、BORDER-LEFT表示图片左侧边框、 BORDER-TOP表示图片上
层边框、BORDER-BOTTOM表示图片下层边框;
<3>、BORDER-RIGHT: #ff0000 3px solid,这段代码中,粉红色表示图片右边框线;绿色处表示边框线
的颜色;红色处表示该边框的粗细;兰色处表示该边框为单线边框.
<4>、是最重点的一步,上面这段代码中兰色处即 "solid"表示单边线框;也就是说只要改变"solid"就能得
到不同效果的边框了.
例如:            solid=单线边框 、     outset=凸出线边框    、  double=双线边框  、
inset=凹出边框 、    dashed=虚线型边框 ...
<5>、代码中兰色处为图片地址,你可以将你所选图片地址放进代码中,再复制代码把它放进代码框中即可.
<5>、操作过程中,选好你要制作边框的图片再根据需要选择相应的边框,点击'预览'查看它的效果图.如不
满意可适当修改代码中的数居值.
2、双线边框:

代码复制区:

src="" target="_blank">http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg">


3.凸出框
 
 
 
 
 
代码复制区:

src="http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg">


4、凹进边框:

代码复制区:

src="" target="_blank">http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg">


5、邮票型边框:

代码复制区:



src="" target="_blank">http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg">

6、虚线型边框

代码复制区:

src="" target="_blank">http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg">


7.凹槽框

代码复制区:

src="" target="_blank">http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg">


8.立体阴影框

代码复制区:



src="" target="_blank">http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg">

9、凹状双线框

代码复制区:



http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg>

10、凹状双内虚线框

代码复制区:



http://image35.360doc.com/DownloadImg/2011/09/0420/17037056_7.jpg" style="border:3 dashed #00cc00">





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





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

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


评论这张
转发至微博
转发至微博
2人  |  分享到:
阅读(7563)| 评论(7)| 引用 (38) |举报
怎样将‘代码’放进代码框内?(原创)
简单“边框”的制作方法?(原创)