注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

逸仙居音画苑

本博内容集音画、音乐、素材、教程为主,文学、休闲为辅

 
 
 

日志

 
 

【转载】用颜色代码做边框  

2014-02-28 18:44:32|  分类: 博客教程 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
本文转载自鳕鯡鮩鲒《用颜色代码做边框》
 

 

用颜色代码做边框

2011年10月11日 - 鳕鯡鮩鲒 - ,

 

 、做颜色边框的代码

<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>

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

说明:红色代码是右边框;绿色代码是上边框;深蓝色代码是左边框;桃红色代码是下边框;天蓝色代码是边框内面背景颜色;

紫色代码cellSpacing=0是限制内边框与外边框距离的,“0”表示没有距离,是可以改变的。(这段代码里没有内边框代码)

#号后面的00ff00是颜色代码,可以变换,要改变边框颜色就要将四边#号后的代码变为同一个代码,否则,四边的颜色就会不同,

颜色代码可以在颜色代码表里找,注意用小写;10PX是表示外边框的宽度,数值可以改变

 效果:

此框代码

此框代码

<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>

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

  外框和背景换色

此框代码

 此框代码

<TABLE style="BORDER-RIGHT: #ae00ae 10px ridge; BORDER-TOP: #ae00ae 10px ridge; BORDER-LEFT: #ae00ae 10px ridge; BORDER-BOTTOM: #ae00ae 10px ridge; BACKGROUND-COLOR: #844200" cellSpacing=0>
<TBODY>
<TR>
<TD>
<P>&nbsp;</P></TD></TR></TBODY></TABLE>

 外框加粗、换色

  此框 代码

  此框 代码

<TABLE style="BORDER-RIGHT: #9d9d9d 20px ridge; BORDER-TOP: #9d9d9d 20px ridge; BORDER-LEFT: #9d9d9d 20px ridge; BORDER-BOTTOM: #9d9d9d 20px ridge; BACKGROUND-COLOR: #750000" cellSpacing=0>
<TBODY>
<TR>
<TD>
<P>&nbsp;</P></TD></TR></TBODY></TABLE>

 

二、边框里添加内边框

1、添加白框代码:

<TABLE border=1>
<TBODY>
<TR>
<TD>

说明:

A、“=”号后的“1”可以变为“2”或“3”.......,不可改得太大,因为这是限制内边框宽度的,太宽了就不好看了;

B、做几个内边框,就将这段代码放开头那段代码的<TD>后,(即“文字”前)并复制粘贴几次。

效果、代码

此框代码

 (加一个内框代码)

此框代码

(加一个内框代码)

<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=5>
<TBODY>
<TR>
<TD>
<TABLE border=1>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TR>

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

此框代码

(加3个内框代码)

此框代码

(加3个内框代码)

<TABLE style="BORDER-RIGHT: #7c3d76 10px ridge; BORDER-TOP: #7c3d76 10px ridge;

BORDER-LEFT:

#7c3d76 10px ridge; BORDER-BOTTOM: #7c3d76 10px ridge; BACKGROUND-COLOR: #d3a4ff"

cellSpacing=3>
<TBODY>
<TR>
<TD>
<TABLE border=1>
<TBODY>
<TR>
<TD>
<TABLE border=1>
<TBODY>
<TR>
<TD>
<TABLE border=1>
<TBODY>
<TR>
<TD></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY>

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

 

3. 添加其他颜色框代码:
<TABLE border=3>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#ffff99 height=3 cellSpacing=1 cellPadding=1 width=800 align=center bgColor=#000000

border=3>
<TBODY>
<TR>
<TD>
说明:就将这段代码放开头那段代码的<TD>后,更换颜色代码,可得不同颜色内框和背景颜色。

此框代码

此框代码

<P></P><FONT size=2></FONT>
<TABLE style="BORDER-RIGHT: #ff0000 10px ridge; BORDER-TOP: #ff0000 10px ridge; BORDER-LEFT: #ff0000 10px ridge; BORDER-BOTTOM: #ff0000 10px ridge; BACKGROUND-COLOR: #ffcc33" cellSpacing=5 align=center>
<TBODY>
<TR>
<TD>
<TABLE border=3>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#ffff99 height=3 cellSpacing=1 cellPadding=1 width=800 align=center bgColor=#000000 border=3>
<TBODY>
<TR>
<TD></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

4、添加一条细颜色框代码:

<TABLE borderColor=#00ff00 height=3 cellSpacing=10 cellPadding=10 width=800 align=center bgColor=#000000

border=1>
<TBODY>
<TR>
<TD>

说明:就将这段代码放开头那段代码的<TD>后,更换TABLE borderColor=#00ff00 颜色代码,得到不同颜色细框。

此框代码

此框代码

<TABLE style="BORDER-RIGHT: #00ff00 10px ridge; BORDER-TOP: #00ff00 10px ridge; BORDER-LEFT: #00ff00 10px ridge; BORDER-BOTTOM: #00ff00 10px ridge; BACKGROUND-COLOR: #460046" cellSpacing=8>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#00ff00 height=3 cellSpacing=10 cellPadding=10 width=800 align=center bgColor=#460046 border=1>
<TBODY>
<TR>
<TD><BR><BR><BR><BR>6<BR><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

 

5、添加细框代码:

<TABLE borderColor=#00ff00 height=3 cellSpacing=10 cellPadding=10 width=800

align=center bgColor=#000000 border=1>
<TBODY>
<TR>
<TD>

说明:就将这段代码放开头那段代码的<TD>后,一次添加粘贴几次,更换颜色代码,

得到几层不同颜色细框。

此框代码

 

此框代码

<TABLE style="BORDER-RIGHT: #00ff00 10px ridge; BORDER-TOP: #00ff00

10px ridge; BORDER-LEFT: #00ff00 10px ridge; BORDER-BOTTOM: #00ff00

10px ridge; BACKGROUND-COLOR: #000000" cellSpacing=5>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#00ff00 height=3 cellSpacing=10 cellPadding=10

width=800 align=center bgColor=#000000 border=1>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#ff0000 height=3 cellSpacing=10 cellPadding=10

width=800 align=center bgColor=#000000 border=1>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#ffd306 height=3 cellSpacing=10 cellPadding=10

width=800 align=center bgColor=#000000 border=1>
<TBODY>
<TR>
<TD>
<P>&nbsp;</P></TD></TR></TBODY></TABLE></TD></TR></TBODY>

</TABLE><FONT color=#ff00cc></FONT></TD></TR></TBODY></TABLE></TD></TR></TBODY>

</TABLE>

   

 此框代码 

 此框代码

(加一个内框代码)

 

代码:

<TABLE style="BORDER-RIGHT: #000099 10px ridge; BORDER-TOP: #000099 10px ridge;

BORDER-LEFT: #000099 10px ridge; BORDER-BOTTOM: #000099 10px ridge; BACKGROUND-COLOR: #080808" cellSpacing=5>
<TBODY>
<TR>
<TD>
<TABLE border=1>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TR>

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

以上边框代码有的来源于网络,有的为网络代码组合而成,试一试更换颜色代码和代码中数据,

你会有所发现!! !2011年10月11日 - 鳕鯡鮩鲒 - ,

 

此框代码

代码:

代码

<TABLE style="BORDER-BOTTOM: rgb(255,220,116) 12px ridge; BORDER-LEFT: rgb(255,220,116) 12px ridge; BORDER-TOP: rgb(255,220,116) 12px ridge; BORDER-RIGHT: rgb(255,220,116) 12px ridge" title=鳕鲱鮩鲒编辑 border=5 cellSpacing=10 borderColor=#ffdc74 cellPadding=12 width=720 bgColor=#000000 align=center>
<TBODY>
<TR>
<TD>
<DIV align=center>&nbsp;</DIV></TD></TR></TBODY>
<P></P>
<P></P></TABLE>

 

 

  

用颜色制作边框

 

代码:

代码
<TD><FONT color=#339966 size=1 face=宋体><STRONG>
<TABLE style="BORDER-BOTTOM: #336666 12px ridge; BORDER-LEFT: #336666 12px ridge; WIDTH: 826px; HEIGHT: 105px; BORDER-TOP: #336666 12px ridge; BORDER-RIGHT: #336666 12px ridge" title=鳕鲱鮩鲒编辑 border=5 cellSpacing=10 borderColor=#336666 cellPadding=12 width=826 bgColor=#000000 align=center>
<TBODY>
<TBODY>
<TR>
<TD></TD></TR></TBODY><BR></TABLE></STRONG></FONT>

 

 

 

用颜色制作边框

代码代码:

用颜色制作边框代码

<TABLE border=50 cellSpacing=5 borderColor=#00ffdd cellPadding=8 width="100%" bgColor=#aaaadd align=center>
<TBODY>
<TR>
<TD>
<TABLE border=1 cellSpacing=5 borderColor=#aa99bb cellPadding=8 width="100%" bgColor=#000000 align=center>
<TBODY>
<TR>
<TD>
<P dir=ltr><FONT color=#ff6633 size=4><STRONG>此处添加内容</STRONG></FONT></P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>


 

 

立 体 边 框 代 码

 

立 体 边 框 代 码

<table style="border:19px #ccffcc ridge" align="center" border="0" cellpadding="0" cellspacing="0" width="460" background="http://bbs.eyu.cn/attachments/ext_jpg/029_mS674YcNXDnk.jpg">
<tr><td><br><br><br><br><br><br></td></tr></table>

 

用颜色代码做边框 - 鳕鯡鮩鲒 - ,

 

用颜色代码做边框 - 鳕鯡鮩鲒 - ,

黑底边框代码 

代码

<TABLE id=blogContentTable cellSpacing=0 cellPadding=0>
<TBODY>
<TR>
<TD vAlign=top><BR><BR>
<P style="TEXT-INDENT: 2em">
<TABLE border=0 cellSpacing=11 borderColor=#cccccc cellPadding=11 width="100%" bgColor=#000000>
<TBODY>
<TR>
<TD>
<TABLE border=5 cellSpacing=3 borderColor=#633414 cellPadding=3 width="100%" bgColor=#000000>
<TBODY>
<TR>
<TD>
<TABLE border=0 cellSpacing=11 borderColor=#cccccc cellPadding=11 width="100%" bgColor=#000000>
<TBODY>
<TR>
<TD>
<TABLE border=1 cellSpacing=0 borderColor=#965d36 cellPadding=0 width="100%" bgColor=#000000>
<TBODY>
<TR>
<TD>
<TABLE border=10 cellSpacing=0 borderColor=#412614 cellPadding=0 width="100%" bgColor=#000000>
<TBODY>
<TR>
<TD>
<TABLE border=1 cellSpacing=0 borderColor=#965d36 cellPadding=0 width="100%" bgColor=#000000>
<TBODY>
<TR>
<TD>
<P style="TEXT-INDENT: 2em"></P>&lt;
<P style="TEXT-INDENT: 2em"></P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
<P style="TEXT-INDENT: 2em">&nbsp;</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR>


  

 

 
蓝边框

l蓝色边框代码

代码:
<TABLE id=blogContentTable cellSpacing=0 cellPadding=0>
<TBODY>
<TR>
<TD vAlign=top><BR>
<P style="TEXT-INDENT: 2em">
<TABLE style="WIDTH: 877px; HEIGHT: 427px" border=0 cellSpacing=11 borderColor=#f0ffff cellPadding=11 width=877 bgColor=#000033 align=center>
<TBODY>
<TR>
<TD>
<TABLE border=5 cellSpacing=3 borderColor=#f0ffff cellPadding=3 width="100%" bgColor=#000033>
<TBODY>
<TR>
<TD>
<TABLE border=0 cellSpacing=11 borderColor=#f0ffff cellPadding=11 width="100%" bgColor=#000033>
<TBODY>
<TR>
<TD>
<TABLE border=1 cellSpacing=0 borderColor=#6600ff cellPadding=0 width="100%" bgColor=#000033>
<TBODY>
<TR>
<TD>
<TABLE border=10 cellSpacing=0 borderColor=#f0ffff cellPadding=0 width="100%" bgColor=#000033>
<TBODY>
<TR>
<TD>
<TABLE border=1 cellSpacing=0 borderColor=#6600ff cellPadding=0 width="100%" bgColor=#000033>
<TBODY>
<TR>
<TD>
<P style="TEXT-INDENT: 2em"></P><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P></TD></TR></TBODY></TABLE>


 

 

鳕鯡鮩鲒博客欢迎您

http://xuefeibingjie.blog.163.com/

title=鳕鯡鮩鲒边框 -

 

  评论这张
 
阅读(159)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017