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

梅园听雪的博客

我畅游在网络中,有很多东西都是我要汲取的。因学习而快乐!

 
 
 

日志

 
 
 
 

【学习】用线条边框美化图片(代码及示例图)  

2008-04-28 20:32:38|  分类: 博客素材技巧分享 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

引用

广寒仙子【学习】用线条边框美化图片(代码及示例图)

   1、简单线框

<IMG style="BORDER-RIGHT: #ffcccc 5px solid; BORDER-TOP: #ffcccc 5px solid; BORDER-LEFT: #ffcccc 5px solid; BORDER-BOTTOM: #ffcccc 5px solid" src="图片地址" >< P>

  2、双线框

<IMG style="BORDER-RIGHT: 7px double; BORDER-TOP: 7px double; BORDER-LEFT: 7px double; BORDER-BOTTOM: 7px double" src="图片地址" P>

  3、虚线框 

<IMG style="BORDER-RIGHT: #990000 3px dashed; BORDER-TOP: #990000 3px dashed; BORDER-LEFT: #990000 3px dashed; BORDER-BOTTOM: #990000 3px dashed" src="图片地址" P>

  4、邮票框

<DIV align=left>
<TABLE style="BORDER-RIGHT: #f6ae56 3px dashed; BORDER-TOP: #f6ae56 3px dashed; BORDER-LEFT: #f6ae56 3px dashed; WIDTH: 125px; BORDER-BOTTOM: #f6ae56 3px dashed; HEIGHT: 125px" cellSpacing=5 cellPadding=0 bgColor=#f6ae56>
<TBODY>
<TR>
<TD vAlign=center align=middle width=125 bgColor=#aeffae height=120><IMG src="图片地址"></TD></TR></TBODY></TABLE></DIV>


  5、凸出框

<IMG style="BORDER-RIGHT: #ccccff 10px outset; BORDER-TOP: #ccccff 10px outset; BORDER-LEFT: #ccccff 10px outset; BORDER-BOTTOM: #ccccff 10px outset" src="图片地址" P>

  6、嵌入框

<IMG style="BORDER-RIGHT: #ff9900 15px inset; BORDER-TOP: #ff9900 15px inset; BORDER-LEFT: #ff9900 15px inset; BORDER-BOTTOM: #ff9900 15px inset" src="图片地址" P>

  7、脊状框

<IMG style="BORDER-RIGHT: #33ff66 15px ridge; BORDER-TOP: #33ff66 15px ridge; BORDER-LEFT: #33ff66 15px ridge; BORDER-BOTTOM: #33ff66 15px ridge" src="图片地址" P>

  8、凹槽框

<IMG style="BORDER-RIGHT: #cc6666 15px groove; BORDER-TOP: #cc6666 15px groove; BORDER-LEFT: #cc6666 15px groove; BORDER-BOTTOM: #cc6666 15px groove" src="图片地址" P>

  9、粒状阴影框

<IMG style="FILTER: progid:DXImageTransform.Microsoft.Glow(color=#ccFF66,strength=30" src="图片地址" P>

  

  10、立体阴影框

<DIV align=left>
<TABLE style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#f6ae56,direction:145,strength:15)" height=125 cellSpacing=3 cellPadding=15 width=125 border=2>
<TBODY>
<TR>
<TD vAlign=center align=middle bgColor=#ffffff><IMG src="图片地址"></TR></TBODY></DIV>

 最后再说一下:

  边框颜色可修改自己喜欢的,带#后面的数值就是颜色代码。

  有关代码数值请点击这里查看!gif动画颜色代码表

请点击这里进入欣赏更多: 【学习】用透明相框美化照片



推荐阅读文章:
*教程 引用 【图文教程】给你的靓照加个闪闪相框(原创)
**引用 【学习】用线条边框美化图片(代码及示例图)
* 引用 【精品素材】经典淡雅的音画框模块(灰色)
**引用 〖素材〗虚线背景图框(代码)
*引用 【精品素材】左边饰花模块
**引用 〖素材〗精美淡雅套装音画框(浅青色)
*引用 【精品素材】背景图片边框(蓝)
** 引用 【精品素材】精美的音画套框(蓝
* 引用 【素材】背景图片图框(一)
**引用 【学习】仙子教做音画贴图

 点击图片即可进入梅园听雪的博客

 点击图片即可进入梅园听雪的博客

 点击图片即可进入梅园听雪的博客

 点击图片即可进入梅园听雪的博客

 点击图片即可进入梅园听雪的博客

 点击图片即可进入梅园听雪的博客

 点击图片即可进入梅园听雪的博客

 点击图片即可进入梅园听雪的博客

梅园听雪欢迎朋友光临

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

历史上的今天

评论

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

页脚

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