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

邓吾佳的个性小屋

小屋陋而不俗,实而不浮,取之有法,学之有章。

 
 
 

日志

 
 

【转载】自用边框(三)博文背景及代码  

2012-10-06 18:40:17|  分类: 博客之家 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

 

【简洁实用多彩的博文背景效果与代码】

 

          简洁多彩的背景效果对美化博文能起到很好的效果。尤其是对没掌握给博文加边框技巧的初学者来说,操作起来简便易行,直接在“添加博文处”处写入日志,就可使博文美观大方,免去了给博文加边框的不便。对老博友来说给博文背景变换一下花样也是一种乐趣。下面我整理了15款博文背景样式供朋友们赏阅。


 

添加博文处 

                                                                                                                                                                           

 

 

添加博文处
 

代码复制处

 <DIV align=center>
<DIV class=content style="BORDER-RIGHT:#00FF99 dashed; BORDER-TOP:#00FF99 dashed; BORDER-LEFT:#00FF99 dashed; WIDTH: 90%; BORDER-BOTTOM:#00FF99 dashed; HEIGHT: 30%; BACKGROUND-COLOR:#00FF99 " align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

<DIV align=center>
<DIV class=content style="BORDER-RIGHT:#ffccff dashed; BORDER-TOP:#ffccff dashed; BORDER-LEFT:#ffccff dashed; WIDTH: 90%; COLOR:#ffccff; BORDER-BOTTOM:#ffccff dashed; HEIGHT: 30%; BACKGROUND-COLOR:#ffccff" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

<DIV align=center>
<DIV class=content style="BORDER-RIGHT:#ffccb6 dashed; BORDER-TOP:#ffccb6 dashed; BORDER-LEFT:#ffccb6 dashed; WIDTH: 90%; BORDER-BOTTOM:#ffccb6 dashed; HEIGHT: 30%; BACKGROUND-COLOR:#ffccb6" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

<DIV align=center>
<DIV class=content style="BORDER-RIGHT:#99ff99 dashed; BORDER-TOP:#99ff99 dashed; BORDER-LEFT:#99ff99 dashed; WIDTH: 90%; BORDER-BOTTOM:#99ff99 dashed; HEIGHT: 30%; BACKGROUND-COLOR:#99ff99" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

<DIV align=center>
<DIV class=content style="BORDER-RIGHT:#ffff66 dashed; BORDER-TOP: #ffff66 dashed; BORDER-LEFT:#ffff66 dashed; WIDTH: 90%; BORDER-BOTTOM:#ffff66 dashed; HEIGHT: 30%; BACKGROUND-COLOR:#ffff66" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

<DIV align=center>
<DIV class=content style="BORDER-RIGHT:#99FF00 dashed; BORDER-TOP:#99FF00 dashed; BORDER-LEFT:#99FF00 dashed; WIDTH: 90%; BORDER-BOTTOM:#99FF00 dashed; HEIGHT: 30%; BACKGROUND-COLOR:#99FF00" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处</FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

 <DIV align=center>
<DIV class=content style="BORDER-RIGHT:  #CCFFFF dashed; BORDER-TOP:#CCFFFF dashed; BORDER-LEFT:#CCFFFF dashed; WIDTH: 90%; BORDER-BOTTOM:#CCFFFF dashed; HEIGHT: 30%; BACKGROUND-COLOR:#CCFFFF" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

<DIV align=center>
<DIV class=content style="BORDER-RIGHT: #cccc66 dashed; BORDER-TOP: #cccc66 dashed; BORDER-LEFT: #cccc66 dashed; WIDTH: 90%; BORDER-BOTTOM: #cccc66 dashed; HEIGHT: 30%; BACKGROUND-COLOR: #cccc66" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处</FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

<DIV align=center>
<DIV class=content style="BORDER-RIGHT: #99ccff dashed; BORDER-TOP: #99ccff dashed; BORDER-LEFT: #99ccff dashed; WIDTH: 90%; BORDER-BOTTOM: #99ccff dashed; HEIGHT: 30%; BACKGROUND-COLOR: #99ccff" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

<DIV align=center>
<DIV class=content style="BORDER-RIGHT: #c850ff dashed; BORDER-TOP: #c850ff dashed; BORDER-LEFT: #c850ff dashed; WIDTH: 90%; COLOR: #c850ff; BORDER-BOTTOM: #c850ff dashed; HEIGHT: 30%; BACKGROUND-COLOR: #c850ff" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

 <DIV align=center>
<DIV class=content style="BORDER-RIGHT:#FFFF99 dashed; BORDER-TOP:#FFFF99 dashed; BORDER-LEFT:#FFFF99 dashed; WIDTH: 90%; BORDER-BOTTOM:#FFFF99 dashed; HEIGHT: 30%; BACKGROUND-COLOR:#FFFF99" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

 <DIV align=center>
<DIV class=content style="BORDER-RIGHT:#99FFCC dashed; BORDER-TOP:#99FFCC  dashed; BORDER-LEFT:#99FFCC dashed; WIDTH: 90%; BORDER-BOTTOM:#99FFCC dashed; HEIGHT: 30%; BACKGROUND-COLOR:#99FFCC " align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处</FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

 <DIV align=center>
<DIV class=content style="BORDER-RIGHT:#FF66FF dashed; BORDER-TOP:#FF66FF dashed; BORDER-LEFT:#FF66FF dashed; WIDTH: 90%; BORDER-BOTTOM:#FF66FF dashed; HEIGHT: 30%; BACKGROUND-COLOR:#FF66FF" align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

 <DIV align=center>
<DIV class=content style="BORDER-RIGHT: #33FFFF dashed; BORDER-TOP:#33FFFF dashed; BORDER-LEFT:#33FFFF dashed; WIDTH: 90%; BORDER-BOTTOM:#33FFFF dashed; HEIGHT: 30%; BACKGROUND-COLOR: #33FFFF   " align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处 </FONT></DIV></DIV></DIV>

 

添加博文处
 

代码复制处

 <DIV align=center>
<DIV class=content style="BORDER-RIGHT:  #FFCC66  dashed; BORDER-TOP: #FFCC66  dashed; BORDER-LEFT:#FFCC66 dashed; WIDTH: 90%; BORDER-BOTTOM: #FFCC66  dashed; HEIGHT: 30%; BACKGROUND-COLOR:#FFCC66  " align=center>
<DIV align=center><FONT style="FONT-SIZE: 20px" color=#000000 size=3> 添加博文处</FONT></DIV></DIV></DIV>

 
 
温馨提示:
1、博文背景颜色也可按自己个性的喜好来改变,改换一下“颜色代码”就可以了。
2、博文背景的宽度:WIDTH: 90% ,可根据日志的需要来增减数字,但不能超99%,否则右边框出现缺损使之不美观。

感谢来访 - 天马行空 - 天马行空

  评论这张
 
阅读(153)| 评论(0)

历史上的今天

评论

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

页脚

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