一、基礎(chǔ)代碼
<IMG src="圖片鏈接地址" width=200>
二、加邊框
1、普通黑色邊框（瀏覽器默認黑色）
<img src="圖片鏈接地址" width=200 border=12>
二、簡略的CSS扮飾框
①<img src="圖片鏈接地址" width=200 style="border:12px #987cb9 solid">
?、?lt;img src="圖片鏈接地址" width=200 style="border:12px #987cb9 dashed">
?、?lt;img src="圖片鏈接地址" width=200 style="border:12px #987cb9 dotted">
?、?lt;img src="圖片鏈接地址" width=200 style="border:12px #987cb9 double">
?、?lt;img src="圖片鏈接地址" width=200 style="border:12px #987cb9 groove">
⑥<img src="圖片鏈接地址" width=200 style="border:12px #987cb9 ridge">
?、?lt;img src="圖片鏈接地址" width=200 style="border:12px #987cb9 inset">
?、?lt;img src="圖片鏈接地址" width=200 style="border:12px #987cb9 outset">
三、加CSS濾鏡
1、無參數(shù)濾鏡
?、俸诎?
<IMG style="FILTER: gray()" src="圖片鏈接地址" width=200>
?、诘装?
<IMG style="FILTER: xray()" src="圖片鏈接地址" width=200>
?、踃光片
<IMG style="FILTER: invert()" src="圖片鏈接地址" width=200>
?、芩椒瓭L轉(zhuǎn)動
<IMG style="FILTER: fliph()" src="圖片鏈接地址" width=200>
⑤鉛直翻滾轉(zhuǎn)動
<IMG style="FILTER: flipv()" src="圖片鏈接地址" width=200>
二、透明效果（opacity=100 透明度0—100）
?、?lt;IMG style="FILTER: Alpha(opacity=100,style=1)" src="圖片鏈接地址" width=200>
?、?lt;IMG style="FILTER: Alpha(opacity=100,style=2)" src="圖片鏈接地址" width=200>
?、?lt;IMG style="FILTER: Alpha(opacity=100,style=3)" src="圖片鏈接地址" width=200>
?、?lt;IMG style="FILTER: Alpha(opacity=0,finishopacity=100,style=1)" src="圖片鏈接地址" width=200>
3、其它殊效
①浮雕
<IMG style="FILTER:progid:DXImageTransform.Microsoft.Em boss()" src="圖片鏈接地址" width=200>
?、诓y
<IMG style="FILTER:progid:DXImageTransform.Microsoft.Wa ve()" src="圖片鏈接地址" width=200>
<IMG style="FILTER:Wave(Add=0,Freq=5,LightStrength=10,P hase=2,Strength=20)" src="圖片鏈接地址" width=200>
?。ˋdd=是不是打亂1或者0；Freq=頻率；LightStrength=光效強度；Phase=偏移量；Strength=振幅）
?、勰：?
<IMG style="FILTER:progid:DXImageTransform.Microsoft.Bl ur()" src="圖片鏈接地址" width=200>
<IMG style="FILTER:Blur(Add=1,Direction=45,Strength=150 )" src="圖片鏈接地址" width=200>
?。ˋdd=是不是模糊1或者0；Direction=標(biāo)的目的；Strength=強度）
?、荛W光
<IMG style="FILTER:progid:DXImageTransform.Microsoft.Gl ow()" src="圖片鏈接地址" width=200>
<IMG style="FILTER:progid:DXImageTransform.Microsoft.Gl ow(Color=#987cb9,Strength=10)" src="圖片鏈接地址" width=200>
（Color=顏色；Strength=強度）
?、蓐幱?
<IMG style="FILTER:progid:DXImageTransform.Microsoft.Sh adow()" src="圖片鏈接地址" width=200>
<IMG style="FILTER:progid:DXImageTransform.Microsoft.Sh adow(Color=#987cb9,Direction=135,Strength=10)" src="圖片鏈接地址" width=200>
?。–olor=顏色；Direction=標(biāo)的目的；Strength=強度）
?、尥队?
<IMG style="FILTER:progid:DXImageTransform.Microsoft.Dr opShadow()" src="圖片鏈接地址" width=200>
<IMG style="FILTER:progid:DXImageTransform.Microsoft.Dr opShadow(Color=#987cb9,Offx=10,Offy=5,Positive=1)" src="圖片鏈接地址" width=200>
?。–olor=顏色；offx=橫向位移；offy=縱向位移；Positive=非透明或者透明像素建立可見投影1或者0）
鏤空
<IMG style="FILTER: Mask()" src="圖片鏈接地址">
四、圖片定位（align=right圖片居右 hspace水平間距 vspace鉛直間距）
<img src="圖片鏈接地址" width=200 align=right hspace="5" vspace="5">
5、添加圖片說明
<img src="圖片鏈接地址" width=200 alt="原來你也在這里">
知道本身的無知，本身就是一種知識！
24
