用HTML在线编辑器制作边框--用代码制作边框（欢迎转载）

HTML教程

QQ--1120602680

瘦身老大欢迎你

紫丁香欢迎你

 

 

用HTML编辑器在

线制作边框

 

 

有的朋友很喜欢边框，可又不知怎么制作，老大­今天就向大家推荐一款HTML在线编辑器，很好用也很简单，喜欢的朋友可转回去慢慢研究制作。

   

 

一、这是一款HTML在线编辑器

 

 

点击下面地址：

 

http://ny.xmu.edu.cn/editor.asp

 

 

 图片

 

打开编辑器，点上面最下一排第9个符号插入表格，如下设置： 

 

图片

 

最上面四组就按图片上设置，单元间距和单元边框是这张图片显示多宽，

可以随你的想法输入，一般线条的宽输入1PX到10PX就可以了，

在“背景图片”那儿插入你想放上去的图片地址。点确定后，

桌面上出现编辑的状态，然后在图片上插入光标，如果不能

插上光标，就在左下角点一下源码在点回编辑，就可以了，

插上光标后跟做第一层一样的，可以根据自己的喜欢放

第二层，第三层等很多层的图片，宽度也自己掌握。

做好边框如下：

 

图片 

 

然后把上面边框宽的部份删一些跟左右一样，下面不用管，

鼠标插在图片的中间，向下击回车键，就能看出边框的效果了，

或者点下面的预览也行。 效果如下：

 

图片


然后点击下面的源代码（在编辑器的左下方），复制全部代码，到你

空间的写日志地方，点开高级，打开HTML编辑，把代码粘贴上去。

在粘贴前要把里面的符号全部删掉，那样才会显示正确。


图片

图片

 

然后在右上角有一个返回，点击返回，就可以看到效果，

然后在边框中间写日志和加上你喜欢的图片就行了。

朋友们喜欢日志做多长，就敲击回车键。边框会自然往下延伸的。

 

 

点击欣赏更多空间制作教程

 

编辑制作/瘦身老大QQ--1120602680

 

 

用代码制作边框
 
 
为简单也可用代码制作，只要在下面代码中加上图片地址，复制到HTML编辑模式写日记里就可使用。
  
 

代码如下 

 

三层边框的原代码

<TABLE style="BACKGROUND-IMAGE: url(这里放图地址一)" borderColor=#cccccc

cellSpacing=40 cellPadding=40 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>

<TD><TABLE style="BACKGROUND-IMAGE: url(这里放图地址二)" borderColor=#cccccc

cellSpacing=3 cellPadding=3 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>
<TD>
<TABLE style="BACKGROUND-IMAGE: url(这里放图地址三)" borderColor=#cccccc

cellSpacing=40 cellPadding=40 width="100%" align=center bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>
<P align=center>&nbsp;</P></TD></TR></TBODY>

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

</TBODY></TABLE></CENTER>
<P></P>

 

四层边框代码

<TABLE style="BACKGROUND-IMAGE: url(这里放图地址一)" borderColor=#cccccc

cellSpacing=3 cellPadding=3 width="100%" align=center bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BACKGROUND-IMAGE: url(这里放图地址二)" borderColor=#cccccc

cellSpacing=40 cellPadding=40 width="100%" align=center bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD><TABLE style="BACKGROUND-IMAGE: url(这里放图地址三)" borderColor=#cccccc

cellSpacing=3 cellPadding=3 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>
<TD>
<TABLE style="BACKGROUND-IMAGE: url(这里放图地址四)" borderColor=#cccccc

cellSpacing=40 cellPadding=40 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>
<TD>
<P align=center>&nbsp;</P></TD></TR></TBODY>

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

</TBODY></TABLE></CENTER>
<P></P>

 

五层边框代码

<TABLE style="BACKGROUND-IMAGE: url(这里放图地址一)" borderColor=#cccccc

cellSpacing=3 cellPadding=3 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>
<TD>
<TABLE style="BACKGROUND-IMAGE: url(这里放图地址二)" borderColor=#cccccc

cellSpacing=3 cellPadding=3 width="100%" align=center bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>

<TABLE style="BACKGROUND-IMAGE: url(这里放图地址三)" borderColor=#cccccc

cellSpacing=40 cellPadding=40 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>

<TD><TABLE style="BACKGROUND-IMAGE: url(这里放图地址四)" borderColor=#cccccc

cellSpacing=3 cellPadding=3 width="100%" align=center bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BACKGROUND-IMAGE: url(这里放图地址五)" borderColor=#cccccc

cellSpacing=40 cellPadding=40 width="100%" align=center bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>

<P align=center>&nbsp;</P></TD></TR></TBODY>

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

</TBODY></TABLE></CENTER>
<P></P>

 

 六层边框代码

<TABLE style="BACKGROUND-IMAGE: url(这里放图地址一)" borderColor=#cccccc

cellSpacing=34 cellPadding=34 width="100%" align=center bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>

<TABLE style="BACKGROUND-IMAGE: url(这里放图地址二)" borderColor=#cccccc

cellSpacing=34 cellPadding=34 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>
<TD>
<TABLE style="BACKGROUND-IMAGE: url(这里放图地址三)" borderColor=#cccccc

cellSpacing=3 cellPadding=3 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>
<TD>

<TABLE style="BACKGROUND-IMAGE: url(这里放图地址四)" borderColor=#cccccc

cellSpacing=40 cellPadding=40 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>
<TD><TABLE style="BACKGROUND-IMAGE: url(这里放图地址五)" borderColor=#cccccc

cellSpacing=3 cellPadding=3 width="100%" align=center bgColor=#ffffff border=0>

<TBODY>
<TR>
<TD>
<TABLE style="BACKGROUND-IMAGE: url(这里放图地址六)" borderColor=#cccccc

cellSpacing=40 cellPadding=40 width="100%" align=center bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>
<P align=center>&nbsp;</P></TD></TR></TBODY>

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

</TBODY></TABLE></CENTER>
<P></P>

 

 

点击欣赏更多空间制作教程

 

 

 

 ╮－ －╭

 

  

 

 ★更多精彩内容请您點擊光臨我空间★

 
图片

文章评论