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

黑玫瑰博客

开放思维磨练一双慧眼,把这世界看远看透再看淡

 
 
 

日志

 
 
关于我

看不清的城市,迷离的心路,到哪里找一个安逸的角落,容得下我的倦意,我有不屈的斗志,却没有称心的器械.我有高尚的灵魂,却不能平伏我欲望的漫延

网易考拉推荐

立体线条边框代码  

2013-04-19 09:39:41|  分类: 日志边框 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

  立体线条边框形状、粗细、颜色和框内背景颜色的代码:

 

<div STYLE="border-style:Groove;border-width:7pt; border-color: red"> <div style="width:100%;height:100%;background-color:#ffdead;">日志文字 </div></div>

 

注:

这段代码是在border-style后面使用不同的语法描述来改变边框形状的:

简单线形边框; Solid 简单双线边框; Double 沟线立体效果边框; Groove 线立体效果边框; Ridge 嵌入线立体效果边框; Inset 浮出线立体效果边框Outset

 

边框线条颜色的改变方法:

绿色处可改变边框的颜色,用英语单词表示,或用#xxxxxx的形式表示也可.

颜色可参考: 颜色代码

 

边框背景颜色的改变方法:

改变边框内背景颜色的方法就是在桃红色代码处改变颜色值。

 

效果:

1、简单线形边框: Solid  边框颜色为绿色 border-color: #00ff00

       背景颜色为background-color:#ffdead(米黄色)

不是立体

日志文字
      2、简单双线边框:Double  边框颜色为border-color: #0000FF

             背景颜色为background-color: #44FFFF(天蓝色)

        不是立体

日志文字

       3、沟线立体效果边框:Groove  边框颜色为border-color: #ff0000 (红色) 背景颜色为background-color: #0000ff(蓝色)

日志文字

 

       4、脊线立体效果边框:Ridge  边框颜色为border-color: #44ffff(天蓝色) 背景颜色为background-color: #ff0000(红色)

日志文字

 

      5、嵌入线立体效果边框:Inset   边框颜色为border-color: #a000ff(紫色) 背景颜色为background-color: #a0ff60(黄绿色)

日志文字

 

      6、浮出线立体效果边框Outset   边框颜色为border-color: #ff00ff(桃红色) 背景颜色为background-color: #ffa0ff(肉红色)

日志文字

 

 

  评论这张
 
阅读(124)| 评论(2)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

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

页脚

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