用CSS實現圖片特效代碼

上邊這張圖片是原圖。以下的圖片效果都以此圖為例。
如本圖的代碼為:

可根據以下各種圖片效果的代碼進行相應的修改。

1.透明效果

代碼：

說明：
opacity:開始處的透明度（0－100）； finishOpacity:結束處的透明度（0－100）；style=0 平均透明、 =1 線狀透明、 =2 圓形透明、 =3 菱形透明。

2.左右翻轉效果

代碼：

3.上下翻轉效果

代碼：

4.灰調效果

代碼：

5.X光效果

代碼：

6.色彩對換效果

代碼：

7.發光邊框效果

代碼：

說明：
color=#4A7AC9發光顏色的代碼； strength=10發光強度； WIDTH: 148px濾鏡寬=圖寬+發光強度x2（128＋10x2=148）； HEIGHT: 158px濾鏡高=圖高+發光強度x2+10（128+10x2+10=158）

8.投影效果

代碼：

說明：
color=#4A7AC9投影顏色的代碼； direction=135投影方向135度（只能是45度的倍數；如:45,90,135,180,225,270,315度）； WIDTH: 153px濾鏡寬=圖寬+25（128＋25=153)； HEIGHT: 168px濾鏡高=圖高+40(128+40=168)

9.陰影製作效果

代碼：

說明：
color=#4A7AC9陰影顏色的代碼； offX=8水平位移8； offY垂直位移8（位移可正可負）； WIDTH: 143px濾鏡寬=圖寬+水平位移絕對值+10（128+8+10=146）；HEIGHT: 156px濾鏡高=圖高+垂直位移絕對值+20（128+8+20=156）
10.模糊效果

代碼：

說明：
direction=45模糊方向45度（只能是45度的倍數；如:45,90,135,180,225,270,315度）； WIDTH: 143px濾鏡寬=圖寬+15（128＋15=143)； HEIGHT: 158px濾鏡高=圖高+30(128+30=158)
11.波形效果

代碼：

說明：
freq=2頻率(>0)； strength=9振幅強度(>0)； lightstrength=5波峰強度(0~100愈高越黑)； phase起始相位(0~100)； WIDTH: 146px濾鏡寬=圖寬+振幅強度x2（128+9x2=146）； HEIGHT: 156px濾鏡高=圖高+振幅強度x2+10（128+9x2+10=156）