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

相约地平线的博客

学如逆水行舟,不进则退……

 
 
 

日志

 
 

【引用】单线、双线边框代码  

2012-05-18 20:56:15|  分类: 默认分类 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
             单线、双线边框代码 - 我也……吔!!! - tzt200820082008的博客 单线、双线边框代码 - 我也……吔!!! - tzt200820082008的博客 单线、双线边框代码 - 我也……吔!!! - tzt200820082008的博客 单线、双线边框代码 - 我也……吔!!! - tzt200820082008的博客 单线、双线边框代码 - 我也……吔!!! - tzt200820082008的博客(我吔!收集整理)单线、双线边框代码 - 我也……吔!!! - tzt200820082008的博客 日志总导航   

单线边框代码 

<div STYLE="border-style:solid;border-width:5pt; border-color:red">日志文字</div>

说明:

border-style则控制边框的效果,border-width控制边框的粗细,border-color调整边框的颜色,这里你仍然可以使用如#xxxxxx的颜色数值,而当使用“solid”则为单一颜色的线形简单边框。

 

<DIV style="BORDER-RIGHT: #ff4500 4px solid; BORDER-TOP: #ff4500 4px solid; BORDER-LEFT: #ff4500 4px solid; BORDER-BOTTOM: #ff4500 4px solid; BACKGROUND-COLOR: #ffdead">实线</DIV>

        说明:

       这是4条边分开写的代码,所以,要将4边#号的值都要改变才能改变边框的颜色;将绿色处#号后的值改变就改变了边框内背景的颜色。

双线框代码

<div STYLE="border-style:Double;border-width:8pt; border-color: #8B008B"> <div style="width:100%;height:100%;background-color:#E6E6FA;">文字</div></div>

 

说明:

    将#号后的值(绿色处)改变就可以改变边框的颜色,随便填一个6位数字,试试?

    将#号后的值(蓝色处)改变就可以改变边框内背景的颜色,随便填一个6位数字,试试?

    看下面改变后的效果:

 

<div STYLE="border-style:Double;border-width:6pt; border-color: #ff4500"> <div style="width:100%;height:100%;background-color:#ffdab9;">文字</div></div>


<div STYLE="border-style:Double;border-width:6pt; border-color: #44ffff"> <div style="width:100%;height:100%;background-color:#FFdead;">文字</div></div>


<div STYLE="border-style:Double;border-width:6pt; border-color: #ff4500"> <div style="width:100%;height:100%;background-color:#FFFFE0;">文字</div></div>


<div STYLE="border-style:Double;border-width:6pt; border-color: #f08080"> <div style="width:100%;height:100%;background-color:#FFdead;">文字</div></div>


<div STYLE="border-style:Double;border-width:6pt; border-color: #f08080"> <div style="width:100%;height:100%;background-color:#FFFFE0;">文字

自用边框(2) - 我也……吔!!! - tzt200820082008的博客  博客教程 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  博客素材 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  博客代码 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  在线制作 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  电脑操作 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  视频欣赏 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  素材网站 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  动画欣赏
自用边框(2) - 我也……吔!!! - tzt200820082008的博客  常用工具 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  音画作品 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  四川地震 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  QQ空间 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  搜索连接 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  我的相册 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  男女专辑 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  博客推广
自用边框(2) - 我也……吔!!! - tzt200820082008的博客  法律知识 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  医理健康 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  丑闻暴光 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  时事新闻 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  幽默笑话 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  历史地理 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  文学专辑 自用边框(2) - 我也……吔!!! - tzt200820082008的博客  我的收藏
单线、双线边框代码 - 我也……吔!!! - tzt200820082008的博客(博客教程)  (博客教程综合篇) 
  评论这张
 
阅读(21)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

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

页脚

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