载入中
自定义HTML载入中... loading
257.十二种精美相框的制作(原创) [原创 2006-12-09 05:19:23]  删除... 
我顶 字号:

 

 

十二种精美相框的制作(原创)

 

第一种:单线框

原始代码:

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

步骤:

1、找到您的图片地址(右键单击图片--属性--地址:(URL)后面的就是您需要的地址),比如图片地址是http://yls88888.bokee.com/inc/logo_s.png 代换原始代码中的“图片地址”,就得到如下代换后的代码:

<IMG style="BORDER-RIGHT: #ff0000 3px solid; BORDER-TOP: #ff0000 3px solid; BORDER-LEFT: #ff0000 3px solid; BORDER-BOTTOM: #ff0000 3px solid" src="http://yls88888.bokee.com/inc/logo_s.png"> 

2、点击打开网页→:HTML在线编辑器,在查看HTML原代码前面的框中打上对钩如下:

3、把您的代换后的代码

<IMG style="BORDER-RIGHT: #ff0000 3px solid; BORDER-TOP: #ff0000 3px solid; BORDER-LEFT: #ff0000 3px solid; BORDER-BOTTOM: #ff0000 3px solid" src="http://yls88888.bokee.com/inc/logo_s.png"> 

放进网页中,在查看HTML原代码前面的框中去掉对钩如下:,这时即可以出现代码转化为图形了如下: ,复制图形

到日志里面发布即可。

 

第二种:双线框

原始代码:

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

效果图:

 

第三种:凸出框

原始代码:

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

效果图:

 

第四种:邮票框

原始代码:

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

效果图:

 

第五种:虚线框

原始代码:

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

效果图: 

 

第六种:凹槽框

原始代码:

 <IMG style="BORDER-RIGHT: green 25px groove; BORDER-TOP: green 25px groove; BORDER-LEFT: green 25px groove; BORDER-BOTTOM: green 25px groove" src="图片地址" border=0>

效果图:

 

 第七种:立体阴影框

原始代码:

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

效果图:

 

第八种: 改变某种颜色

原始代码:

<IMG style="FILTER: Chroma(Color=RED)" src="图片地址">

效果图:

原始代码:

 <IMG style="FILTER: progid:DXImageTransform.Microsoft.Emboss()" src="图片地址">

效果图: 

 

第九种:上下颠倒

原始代码:

<IMG style="FILTER: flipv" src="图片地址">

效果图:

 

第十种:色彩颠倒

原始代码:

 <IMG style="FILTER: invert" src="图片地址">

效果图:

 

第十一种:立状阴影

原始代码:

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

效果图:

 

第十二种:水波效果(风吹)

原始代码:

 <IMG style="FILTER: wave(freq=11, strength=4, phase=6, lightstrength=10)" src="图片地址">

效果图:

 

温情提醒:

更多精彩内容请点击博客主页:

偶的博客网博客主页:

http://yls88888.bokee.com 或 鹰震天

偶的和讯博客主页:

http://yayb.blog.hexun.com鹰震天

 
博客网版权所有
发表评论
大 名:
(不填写则显示为匿名者)
网 址:
(您的网址,可以不填)
标 题:
内 容:
请根据下图中的字符输入验证码:
(您的评论将有可能审核后才能发表)
和讯个人门户 v1.0 | 和讯部落 | 客服中心