一、不引用图片地址做边框的代码:
首先看一下效果图,如下:
这里是文字的输入地方,随着文字的增多,边框就逐渐放大。可以放加入背景图片的代码 ,在这里还可以放一个或多个动画代码(做多层透明flash动画)。 |
代码如下:
<TABLE style="BORDER-RIGHT: #FF0000 10px ridge; BORDER-TOP: #00ff00 10px ridge; BORDER-LEFT: #0000ff 10px ridge; BORDER-BOTTOM: #CC00ff 10px ridge; BACKGROUND-COLOR: #0099ff" cellSpacing=0> <TBODY> <TR> <TD>
这里是文字的输入地方,随着文字的增多,边框就逐渐放大。可以放加入背景图片的代码 ,在这里还可以放一个或多个动画代码(做多层透明flash动画)。
</TD></TR></TBODY></TABLE>
说明:
<1>: (上、下、左、右边框的取色)红色代码是右边框;绿色代码是上边框;深蓝色代码是左边框;桃红色代码是下边框;
<2>:天蓝色代码是边框内面背景颜色;黄色代码cellSpacing=0是限制内边框与外边框距离的,“0”表示没有距离.(可根据需要,适当修改其数据)
<3>:边框颜色的取色,要根据你的需要而选取不同的颜色.找到代码中的 # 号后面的000000便是颜色代码,'00000'为黑色代码.颜色的选用,请叁见:《颜色代码大全》一文.(点击下列表格中的文章)
<4>:要想使四面边框颜色统一,只需将 # 号后面的'000000'全部变为同一颜色代码即可.10px是表示外边框的宽度,数值同样可以适当修改.
<5>:这段代码中没有内边框代码,所以称之为:一层边框或单层背景边框.
二、多层边框的制作方法:(二层边框)
上面讲的是一层即单层边框的制作方法.那么该怎样给单层边框加多层内边框呢?
先看下面代码:(二层边框)
<TABLE style="BORDER-RIGHT: #00ff00 10px ridge; BORDER-TOP: #00ff00 10px ridge;
BORDER-LEFT: #00ff00 10px ridge; BORDER-BOTTOM: #00ff00 10px ridge;
BACKGROUND-COLOR: #ff0000" cellSpacing=0> <TBODY> <TR> <TD>
<TABLE border=1> <TBODY> <TR> <TD>
这里是文字的输入地方,随着文字的增多,边框就逐渐放大。可以放加入背景图片的代码 ,在这里还可以放一个或多个动画代码(做多层透明flash动画)。
</TD></TR></TBODY></TABLE>
说明:
<1>:黑色处为单层边框代码. 绿色处为多层边框开头的必加代码,把它放在单层代码后面;
<2>:兰色处即为内层边框,其中 border=1表示内边框的粗、细,可在1-6之间选择.数值过大,边框就会显得过粗而影响美观;cellSpacing=0表示内外边框间的距离;
<3>:此代码为二层边框代码,看它的效果图如下:
这里是文字的输入地方,随着文字的增多,边框就逐渐放大。可以放加入背景图片的
代码 ,在这里还可以放一个或多个动画代码(做多层透明flash动画)。 | |
<4>:如将上面代码中的border=1、cellSpacing=0数值修改为;border=4、cellSpacing=6后,看到的效果图如下:
这里是文字的输入地方,随着文字的增多,边框就逐渐放大。可以放加入背景图片
的代码 ,在这里还可以放一个或多个动画代码(做多层透明flash动画)。 | |
<5>:如果想做三、四或多层边框,只需采用复制粘贴上面代码中码兰色处即可.现在我以四层边框为例:
看代码:
<TABLE style="BORDER-RIGHT: #00ff00 10px ridge; BORDER-TOP: #00ff00 10px ridge;
BORDER-LEFT: #00ff00 10px ridge; BORDER-BOTTOM: #00ff00 10px ridge;
BACKGROUND-COLOR: #ff0000" cellSpacing=0> <TBODY> <TR> <TD>
<TABLE cellSpacing=0 border=1> <TBODY> <TR> <TD>
<TABLE cellSpacing=0 border=1> <TBODY> <TR> <TD>
<TABLE cellSpacing=0 border=1> <TBODY> <TR> <TD>
<TABLE cellSpacing=0 border=1> <TBODY> <TR> <TD>
这里是文字的输入地方,随着文字的增多,边框就逐渐放大。可以放加入背景图片的代码 ,在这里还可以放一个或多个动画代码(做多层透明flash动画)。
</TD></TR></TBODY></TABLE>
说明:cellSpacing=0和上面同样表示内边框与内边之间的距离 border=1表示里层各边框的粗、细度.
看它的效果图如不:(该效果图中的cellSpacing=0、border=1数据本人己作了修改)
这里是文字的输入地方,随着文字的增多,边框就逐渐放大。可以放加入背景图片
的代码 ,在这里还可以放一个或多个动画代码(做多层透明flash动画)。 | | | | |
以上就是不用图片地址,来做简易边框的方法. |
评论