多语言展示
当前在线:153今日阅读:126今日分享:42

多列边框制作方法

博文配上边框,会提高美化效果。这里介绍一种给横排图片做边框的方法。此种方法用代码制作,且闪动。小编原先做过“多行边框制作方法”,今天所做与之配套。
工具/原料
1

自己的博客。

2

基础代码:

<TABLE width=680 height=325 borderColor=#FFFFFF borderColorDark=#000000 cellSpacing=3 cellPadding=10  bgColor=#CC0066 background=图片边框地址 border=1>

<TBODY>

<TR>

<TD width=340 bgColor=#6699ff></TD>

<TD width=340 bgColor=#6699ff></TD></TR></TBODY></TABLE> 

方法/步骤
1

制作、搜集、整理边框图片素材。    下面提供7个素材。你可自己制作多张备用。

2

找素材。    1、在上边图片中选一张准备使用的,右击图片;    2、在弹框中点“图片另存为”,保存到硬盘;     3、如果自己存有素材,可随时调用(上两步就省略了)。

3

上传图片。(这里以新浪博客为例,下同)    1、在后台点“图片”,点“添加”;    2、在弹框中点刚才保存的图片,点“打开”、点“插入图片”。

4

制作图片地址。    1、点“显示源代码”进行代码编辑;    2、找到图片代码,复制粘贴到“记事本”。

5

编辑边框。    1、清空代码,将本文前面“工具/原料”给的那组代码复制,粘贴到编辑器;    2、将上步备用的图片地址代码复制,粘贴至“图片边框地址”处,替换。

6

增加边框。    方法:复制一个边框代码,重复粘贴。    此步是两列边框增至三列边框的方法。如还增加重复此步。

7

改变颜色和边框宽度。    颜色:改变TD后面bgColor的值。    边框宽度:改变cellSpacing值。

8

调整边框宽度、高度。    宽度:改变width值;高度:改变height值。

9

大调整。    顺序:先增加列,再增加行。

推荐信息