CSS濾鏡參考(收集)
$ @! q8 K+ S( \0 x! l) B+ Y5 d# N3 z
語法: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 濾鏡說明: . m8 _9 B2 ~+ \- W
6 S) m( E" @$ J2 c: R Alpha:設置透明層次 5 X" ?: Z8 T) n: u" N# t
blur:創建高速度移動效果,即模糊效果 2 r# p) G, x& {/ L
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:加光輝在附近對象的邊外 4 K5 k. ^% E! T) W) C& ?9 ^
gray:把圖片灰度化
+ @, A( ^1 _! S! F/ w/ X4 e! s4 O invert:反色 # l; l+ i" m5 h0 q$ O5 ?% ]9 b
light:創建光源在對像上
4 S! r7 n9 {2 c6 Q4 l- T mask:創建透明掩膜在對像上
8 \0 B1 [0 l! M( v( v" o x9 b/ Q shadow:創建偏移固定影子 ( c* @# U0 l5 G! S, l
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)" ( ]6 d) o& {% O. t
說明: 8 F# C" m8 t# G
Opacity:起始值,取值為0~100, 0為透明,100為原圖。 * Z5 b4 l' ^& t3 y; J* o5 u
FinishOpacity:目標值。 - K5 E P3 ^% n3 ]1 c
Style:1或2或3 ' b* j" v8 L: R0 @( \+ Q
StartX:任意值
9 u# w+ {# Z" z! j StartY:任意值 + T0 A& s4 E3 f1 s
例子:filter:Alpha(Opacity="0",FinishOpacity="75",Style="2") , F# @- ]3 R( Q; g' D2 M
& 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)" / \- V, h7 a0 i- A
說明: 6 ?* A2 Q! L( d9 t* P! s
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") " n3 C r2 P7 M f7 x
8 y4 A1 X6 l0 r' _. x
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") ; a4 q4 U @" t( f( f! m
: l9 S+ ?& P- I5 H5 I; B
4、濾鏡:DropShadow 4 s, I6 Q; p+ f/ s% x; ]
語法:STYLE="filter:DropShadow(Color=color, OffX=offX, OffY=offY, Positive=positive)"
! I( @. U4 U% f4 o- u 說明:Color:#rrggbb格式,任意。 + Q+ ?. j3 S( u
Offx:X軸偏離值。
, i. I; B/ d' X/ i6 z Offy:Y軸偏離值。 ' a8 v3 y# N$ c+ ^
Positive:1或0。 / M2 P& U9 q5 b$ {- J0 V) O* c
例子:filter:DropShadow(Color="#6699CC",OffX="5",OffY="5",Positive="1") 5 V; M, i" O4 o- q4 s1 @7 [. C
. `' 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 \( c! R" q: _
, J/ n1 b- ?# a* v: H% F 6、濾鏡:FlipV % L) T( j. {# A( H( f
語法:STYLE="filter:FlipV"
. ~& r1 `1 r4 r. h2 {) r- m 例子:filter:FlipV 1 I f- g( e! d! t: O5 v4 N. s2 a
7 b1 _0 Y" B7 r9 { ^) f9 S 7、濾鏡:glow 9 H% Y/ {0 x! Z* Y, i
語法:STYLE="filter:Glow(Color=color, Strength=strength)"
( w. n( o/ @+ S; j 說明: 9 V" d1 A. k! q/ Y/ n* K
Color:發光顏色。 * n. y s0 D7 W/ \. V
Strength:強度(0-100)
# r: _/ q; v. D! r8 Z% A. W 例子:filter:Glow(Color="#6699CC",Strength="5") + D8 I* F: |9 n0 Z
3 u5 d2 C) i# ^/ ~6 @& c4 r, o& Q6 S9 a
8、濾鏡:gray ; r8 ^. E) W& F8 Q4 _
語法:STYLE="filter:Gray"
# J" H! Y3 E3 r9 j 例子:filter:Gray $ W: [2 N9 M+ ?
& u8 X$ _# X* m* C, l. ~+ P
9、濾鏡:invert ; o! P8 O6 \! G5 a# I
語法:STYLE="filter:Invert"
1 x+ c/ R7 X; A7 K5 Q0 h 例子:filter:Invert
# b0 {1 Y2 l8 A( t, b; N, e& ^. q8 d8 e/ z8 e' S# p# l; Y1 d3 d; V- w6 f
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 說明: * z; @" {3 n: }6 }. C7 m+ P
Color:#rrggbb格式。
+ T# N) c8 U f6 o% W o' \ Direction:角度,0-315度,步長為45度。 6 A" i6 f3 c- T
例子: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 說明: : J# ~# n: c# [: `3 _ C! p M
Add:一般為1,或0。 " U( v' }/ J; g( D+ P0 F
Freq:變形值。 - n' \; a5 T1 b9 P; G
LightStrength:變形百分比。 # _2 q) i9 |! ^- b$ u; B2 [
Phase:角度變形百分比。 7 R9 J3 u& R3 s7 `4 m
Strength:變形強度。
, x- j6 l- Y5 q6 k 例子:filter: wave(Add="0", Phase="4", Freq="5", LightStrength="5", Strength="2") ; Z% {2 A6 O( f5 i% ~
) Q. v$ y: s; n$ ]$ {% L x8 o
13、濾鏡:Xray $ H& M2 N# {( l/ {
語法:STYLE="filter:Xray" 9 t9 t, W& I- a5 K! n( J+ r
例子:filter:Xray 4 C6 s) L5 p0 L! O' v; ]3 w
3 `* h9 N& Z' e/ o
, f' M+ l$ q1 E6 b3 d註:ZT!- `% ~6 Q! r6 ~3 a
: r" u/ j; s ]1 U
[[i] 本帖最後由 wuhao 於 2006-7-30 11:01 編輯 [/i]] |
|