(Z)幾種圖片代碼特效 -- 好好改造
文章來源:
新網
於
2005-07-20 15:28:31
如沒有設定bordercolor, 那便默認為黑色
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" border=12>
加簡單的CSS裝飾框
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="border:12px #00ffff solid">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="border:12px #00ffff dashed">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="border:12px #00ffff dotted">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="border:12px #00ffff double">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="border:12px #00ffff groove">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="border:12px #00ffff ridge">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="border:12px #00ffff outset">
CSS濾鏡
style="filter: Alpha(Opacity=100,Style=2)">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" <br>style="filter: Alpha(Opacity=100,Style=2)">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="filter: Alpha(Opacity=100,Style=3)">
水平翻轉
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="filter: Fliph">
垂直翻轉
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="filter: Flipv">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="filter: Gray">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="filter: Invert">
<img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="filter: Blur(Add=1,Direction=45,Strength=180)">
Freq=6波紋的頻率,Lightstrength=10波紋的光照強度,值0---100,Strength=20振幅<br><img onload='javascript:if(this.width>850) this.width=850' width=390 src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" style="filter: Wave(Add=0,Freq=6,Lightstrength=10,Phase=0,Strength=20)">
<BR><br><P align=center><br><CENTER><br><TABLE style="BORDER-RIGHT: #ababab 1px solid; BORDER-TOP: #ababab 1px solid; BORDER-LEFT: #ababab 1px solid; BORDER-BOTTOM: #ababab 1px solid; BACKGROUND-COLOR: #dcdcdc" cellSpacing=10 cellPadding=0 border=0><br><TBODY><br><TR><br><TD style="BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid; BACKGROUND-COLOR: #ffffff" vAlign=center align=middle colSpan=2><br><CENTER><img onload='javascript:if(this.width>850) this.width=850' style="FILTER: Blur(Add=1,Direction=45,Strength=180)" src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" width=390></CENTER></TD></TR></TBODY></TABLE></CENTER><br><P></P>
加點變化
<BR><P align=center><img onload='javascript:if(this.width>850) this.width=850' style="BORDER-RIGHT: red 8px dashed; BORDER-TOP: green 8px dotted; BORDER-LEFT: yellow 8px dashed; BORDER-BOTTOM: blue 8px dotted" src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" width=390></P><BR>
<BR><center><TABLE bgcolor=black style="border:12px #00ffff dashed"><TBODY><TR><TD><TABLE bgcolor=black style="border:12px #00ffff ridge"><TBODY><TR><TD><img onload='javascript:if(this.width>850) this.width=850' width=390 src=http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif style="filter: Gray"></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></center><BR>
做圖的方法很多, 上麵的是用了兩個框的效果, 其實用一個框也能做出相同效果的. 隻要在 < TD> 加點變化.
<BR><br><CENTER><br><TABLE style="BORDER-RIGHT: #00ffff 12px dashed; BORDER-TOP: #00ffff 12px dashed; BORDER-LEFT: #00ffff 12px dashed; BORDER-BOTTOM: #00ffff 12px dashed" bgColor=black><br><TBODY><br><TR><br><TD style="BORDER-RIGHT: #00ffff 12px ridge; BORDER-TOP: #00ffff 12px ridge; BORDER-LEFT: #00ffff 12px ridge; BORDER-BOTTOM: #00ffff 12px ridge" bgColor=black><img onload='javascript:if(this.width>850) this.width=850' style="FILTER: Gray" src="http://vcom.hnby.com.cn/dhbbs/UploadFile/2005-7/200572011264682519.gif" width=390></TD></TR></TBODY></TABLE></CENTER><BR>
http://web.wenxuecity.com/BBSView.php?SubID=music&MsgID=110979