|
圖片加邊框代碼
這里教大家只需用html代碼就能給你的圖片加出各種漂亮的相框,，使用方法,，點(diǎn)“<>”加入代碼，換上你的圖片網(wǎng)址,，適當(dāng)調(diào)整寬度和顏色,，就可以讓你的圖片錦上添花！下面是代碼：
1,、簡(jiǎn)單線框
<img src="圖片地址" style="border:5 solid #ffCCCC">
2,、雙線框
<img src="圖片地址" style=" border:7 double #666FF">
3、虛線框
<img src="圖片地址" style=" border:3 dashed #990000">
4,、凸出框：
<img src="圖片地址" style="border:10 outset #CCCCFF">
5,、嵌入框：
<img src="圖片地址" style="border:15 inset #ff9900">
6、脊?fàn)羁颍?/font>
<img src="圖片地址" style="border:15 ridge #33FF66">
7,、凹槽框
<img src="圖片地址" style="border:15 groove #CC6666">
8,、粒狀陰影框
<img src="圖片地址" style="filter:progid:DXImageTransform.Microsoft.Glow(color=#ccFF66,strength=30">
做個(gè)效果：
一
原圖：
1、簡(jiǎn)單線框
2,、雙線框
3,、虛線框
4、凸出框：
5,、嵌入框：
6,、脊?fàn)羁颍?
7、凹槽框
8,、粒狀陰影框
代碼：
<P> 1,、簡(jiǎn)單線框 </P>
<P> <IMG style="BORDER-RIGHT: #ffcccc 5px solid; BORDER-TOP: #ffcccc 5px solid; BORDER-LEFT: #ffcccc 5px solid; BORDER-BOTTOM: #ffcccc 5px solid" src="http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_1.jpg"> </P>
<P> 2、雙線框 </P>
<P> <IMG style="BORDER-RIGHT: 7px double; BORDER-TOP: 7px double; BORDER-LEFT: 7px double; BORDER-BOTTOM: 7px double" src="http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_1.jpg"> </P>
<P> 3,、虛線框 </P>
<P> <IMG style="BORDER-RIGHT: #990000 3px dashed; BORDER-TOP: #990000 3px dashed; BORDER-LEFT: #990000 3px dashed; BORDER-BOTTOM: #990000 3px dashed" src="http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_1.jpg"> </P>
<P> 4,、凸出框： </P>
<P> <IMG style="BORDER-RIGHT: #ccccff 10px outset; BORDER-TOP: #ccccff 10px outset; BORDER-LEFT: #ccccff 10px outset; BORDER-BOTTOM: #ccccff 10px outset" src="http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_1.jpg"> </P>
<P> 5、嵌入框： </P>
<P> <IMG style="BORDER-RIGHT: #ff9900 15px inset; BORDER-TOP: #ff9900 15px inset; BORDER-LEFT: #ff9900 15px inset; BORDER-BOTTOM: #ff9900 15px inset" src="http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_1.jpg"> </P>
<P> 6、脊?fàn)羁颍? </P>
<P><IMG style="BORDER-RIGHT: #33ff66 15px ridge; BORDER-TOP: #33ff66 15px ridge; BORDER-LEFT: #33ff66 15px ridge; BORDER-BOTTOM: #33ff66 15px ridge" src="http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_1.jpg"> </P>
<P> 7,、凹槽框 </P>
<P> <IMG style="BORDER-RIGHT: #cc6666 15px groove; BORDER-TOP: #cc6666 15px groove; BORDER-LEFT: #cc6666 15px groove; BORDER-BOTTOM: #cc6666 15px groove" src="http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_1.jpg"> </P>
<P>8,、粒狀陰影框 </P>
<P><IMG style="FILTER: progid:DXImageTransform.Microsoft.Glow(color=#ccFF66,strength=30" src="http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_1.jpg"> </P>
——————————————————
二
原圖：
1. 圖片單邊框的代碼:
<center><img src=" http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_2.jpg" style="border:3 solid #ff0000"></center>
下面是一的效果圖:
2.圖片雙邊框的代碼:
<center><img src=" http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_2.jpg" style="border:5 double green"></center>
下面是二的效果圖:
3.立體鏡框的代碼（一）:
<center><img src= http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_2.jpgstyle="border:25 outset #ff88ff"></center>
下面是三的效果圖:
4.立體鏡框的代碼（二）:
<center><img src=" http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_2.jpg" style="border:25 inset #ff88ff"></center>
下面是四的效果圖:
5.虛線框的代碼:
<center> <img src="http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_2.jpg" style="border:4 dashed #ff0000"></center>
下面是五的效果圖:
6.凹槽框的代碼:
<center> <img src=" http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_2.jpg" style="border:25 groove green" border="0"></center>
下面是六的效果圖:
7.脊?fàn)羁虻拇a:
<center> <img src=" http://image4.360doc.com/DownloadImg/2009/3/26/92346_2922658_2.jpg" style="border:25 ridge green" border="0"></center>
下面是七的效果圖:
八：立體陰影框代碼如下：
<TABLE style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#f6ae56,direction:145,strength:15)" height=100 cellSpacing=3 cellPadding=15 width=100 border=2>
<TBODY>
<TR>
<TD Align=center align=middle bgColor=#ffffff><IMG src="圖片地址"></TD></TR></TBODY></TABLE>
效果圖：
九：立狀陰影代碼如下：
<IMG style="FILTER: progid:DXImageTransform.Microsoft.Glow(color=#cc8888,strength=30)" src="圖片地址">
效果圖：
當(dāng)然以上代碼也可用在制作日記的邊框上，或者個(gè)人檔案里的文字和圖片,，大家可以舉一反三,。顏色可以改為自己喜歡的。
全屏FLASH代碼
注意：＆要換成小寫&
<img src=";nnerHTML+=''<div style=\'';top:0;left:0;\''><EMBED src=\''地址\'' quality=high wmode=\''transparent\'' WIDTH=\''775\'' HEIGHT=\''655\'' TYPE=\''application/x-shockwave-flash\''></div>'';">
或者
<img src=";rHTML+=''<div style=\'';top:0;left:0;\''><EMBED src=\''FLASH地址\''quality=high wmode=\''transparent\'' WIDTH=\''1000\'' HEIGHT=\''700\'' TYPE=\''application/x-shockwave-flash\''></div></div>'';">
|
