CSS濾鏡參考（收集）

CSS濾鏡參考（收集）
$ @! q8 K+ S( \0 x
語法：STYLE="filter:filtername(fparameter1, fparameter2...)"
2 R: V6 Y+ o, D3 U　　（Filtername為濾鏡的名稱，fparameter1、fparameter2等是濾鏡的參數）
: j& g, U$ j% r0 [script 語法：HTMLElement.filters.filterName.fParameter=value;
' u6 M/ I( M! w
9 ]6 O8 y# [+ D  j　　濾鏡說明：

6 S) m( E" @$ J2 c: R　　Alpha：設置透明層次
　　blur：創建高速度移動效果，即模糊效果
　　Chroma：製作專用顏色透明
4 T( d5 C* G8 b' o: z' ?5 X　　DropShadow：創建對象的固定影子
6 R$ b! G5 w% X6 B! U　　FlipH：創建水平鏡像圖片
- x( N- }$ J! l; t' f. }　　FlipV：創建垂直鏡像圖片
& l. g% d6 J3 Q4 H; D2 S8 R; d　　glow：加光輝在附近對象的邊外
　　gray：把圖片灰度化
+ @, A( ^1 _! S! F/ w/ X4 e! s4 O　　invert：反色
　　light：創建光源在對像上
4 S! r7 n9 {2 c6 Q4 l- T　　mask：創建透明掩膜在對像上
8 \0 B1 [0 l! M( v( v" o  x9 b/ Q　　shadow：創建偏移固定影子
　　wave：波紋效果
* ?" ]3 C9 n, b# w　　Xray：使對像變得像被x光照射一樣
) Y2 c; P# M+ c! @2 l
) z5 t$ m, ^9 Z　　1、濾鏡：Alpha
% o9 _0 U7 A2 x' ]2 J8 E0 u; r　　語法：STYLE="filter:Alpha(Opacity=opacity, FinishOpacity=finishopacity，Style=style, StartX=startX，StartY=startY，FinishX=finishX，FinishY=finishY)"
　　說明：
　　Opacity：起始值，取值為0～100, 0為透明，100為原圖。
　　FinishOpacity：目標值。
　　Style：1或2或3
　　StartX：任意值
9 u# w+ {# Z" z! j　　StartY：任意值
　　例子：filter:Alpha(Opacity="0",FinishOpacity="75",Style="2")

& f5 ?3 J3 D, z8 C; I$ f1 E* I　　2、濾鏡：blur
! l0 ^$ x* [& J) I7 T　　語法：STYLE="filter:Blur(Add = add, Direction = direction, Strength = strength)"
　　說明：
　　Add：一般為1，或0。
$ Y  ^* X. D$ v$ X$ j　　Direction：角度，0～315度，步長為45度。
+ F+ }% I: G% ]4 i　　Strength：效果增長的數值，一般5即可。
! x) z% N+ X1 Q7 ?# _　　例子：filter:Blur(Add="1",Direction="45",Strength="5")

　　3、濾鏡：Chroma
: c1 Y6 m+ w9 i6 s6 Y6 b, a　　語法：STYLE="filter:Chroma(Color = color)"
& @+ e  d4 v, G. W* {　　說明：color：#rrggbb格式，任意。
3 H0 t$ x; _/ ~! `　　例子：filter:Chroma(Color="#FFFFFF")

　　4、濾鏡：DropShadow
　　語法：STYLE="filter:DropShadow(Color=color, OffX=offX, OffY=offY, Positive=positive)"
! I( @. U4 U% f4 o- u　　說明：Color:#rrggbb格式，任意。
　　Offx：X軸偏離值。
, i. I; B/ d' X/ i6 z　　Offy：Y軸偏離值。
　　Positive：1或0。
　　例子：filter:DropShadow(Color="#6699CC",OffX="5",OffY="5",Positive="1")

. `' r6 c+ @) m: s5 A; u　　5、濾鏡：FlipH
5 z. Q5 r4 y3 P　　語法：STYLE="filter:FlipH"
5 [0 M$ Q1 B, ?' K　　例子：filter:FlipH

, J/ n1 b- ?# a* v: H% F　　6、濾鏡：FlipV
　　語法：STYLE="filter:FlipV"
. ~& r1 `1 r4 r. h2 {) r- m　　例子：filter:FlipV

7 b1 _0 Y" B7 r9 {  ^) f9 S　　7、濾鏡：glow
　　語法：STYLE="filter:Glow(Color=color, Strength=strength)"
( w. n( o/ @+ S; j　　說明：
　　Color：發光顏色。
　　Strength：強度(0－100)
# r: _/ q; v. D! r8 Z% A. W　　例子：filter:Glow(Color="#6699CC",Strength="5")

　　8、濾鏡：gray
　　語法：STYLE="filter:Gray"
# J" H! Y3 E3 r9 j　　例子：filter:Gray

　　9、濾鏡：invert
　　語法：STYLE="filter:Invert"
1 x+ c/ R7 X; A7 K5 Q0 h　　例子：filter:Invert
# b0 {1 Y2 l8 A( t, b; N, e& ^. q8 d
　　10、濾鏡：mask
& F- E  H# q( o8 V; K% }$ }' ]  U　　語法：STYLE="filter:Mask(Color=color)"
4 f& i3 Z3 l5 ?: V2 Y5 O. ]" Q- Q　　例子：filter:Mask (Color="#FFFFE0")
) n( a" b2 F7 z
4 w) Q1 D& `% d% S　　11、濾鏡：shadow
5 q. R1 }2 s: H% \$ z$ ^" m, C6 ~　　語法：filter:Shadow(Color=color, Direction=direction)
+ q3 T7 V/ y; F4 t　　說明：
　　Color：#rrggbb格式。
+ T# N) c8 U  f6 o% W  o' \　　Direction：角度，0－315度，步長為45度。
　　例子：filter:Shadow (Color="#6699CC", Direction="135")
( W4 g: X. i+ F9 J! V5 c$ u, E
0 ], i, T5 S" O8 I) H0 j　　12、濾鏡：wave
: ^; Y! |: g& b+ e3 Q　　語法：filter: Wave(Add=add，Freq=freq，LightStrength=strength，Phase=phase，Strength=strength)
) L, j9 l* r, o: z$ B& I$ f　　說明：
　　Add：一般為1，或0。
　　Freq：變形值。
　　LightStrength：變形百分比。
　　Phase：角度變形百分比。
　　Strength：變形強度。
, x- j6 l- Y5 q6 k　　例子：filter: wave(Add="0", Phase="4", Freq="5", LightStrength="5", Strength="2")

　　13、濾鏡：Xray
　　語法：STYLE="filter:Xray"
　　例子：filter:Xray

3 `* h9 N& Z' e/ o
, f' M+ l$ q1 E6 b3 d註：ZT！

[[i] 本帖最後由 wuhao 於 2006-7-30 11:01 編輯 [/i]]