CSS濾鏡參考
語法:STYLE="filter:filtername(fparameter1, fparameter2…)"
(Filtername為濾鏡的名稱,fparameter1、fparameter2等是濾鏡的參數)
script 語法:HTMLElement.filters.filterName.fParameter=value;
濾鏡說明:
Alpha:設置透明層次
blur:創建高速度移動效果,即模糊效果
Chroma:制作專用顏色透明
DropShadow:創建對象的固定影子
FlipH:創建水平鏡像圖片
FlipV:創建垂直鏡像圖片
glow:加光輝在附近對象的邊外
gray:把圖片灰度化
invert:反色
light:創建光源在對象上
mask:創建透明掩膜在對象上
shadow:創建偏移固定影子
wave:波紋效果
Xray:使對象變得像被x光照射一樣
1、濾鏡:Alpha
語法: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:任意值
StartY:任意值
例子:filter:Alpha(Opacity="0",FinishOpacity="75",Style="2")
2、濾鏡:blur
語法:STYLE="filter:Blur(Add = add, Direction = direction, Strength = strength)"
說明:
Add:一般為1,或0。
Direction:角度,0~315度,步長為45度。
Strength:效果增長的數值,一般5即可。
例子:filter:Blur(Add="1",Direction="45",Strength="5")
3、濾鏡:Chroma
語法:STYLE="filter:Chroma(Color = color)"
說明:color:#rrggbb格式,任意。
例子:filter:Chroma(Color="#FFFFFF")
4、濾鏡:DropShadow
語法:STYLE="filter:DropShadow(Color=color, OffX=offX, OffY=offY, Positive=positive)"
說明:Color:#rrggbb格式,任意。
Offx:X軸偏離值。
Offy:Y軸偏離值。
Positive:1或0。
例子:filter:DropShadow(Color="#6699CC",OffX="5",OffY="5",Positive="1")
5、濾鏡:FlipH
語法:STYLE="filter:FlipH"
例子:filter:FlipH
6、濾鏡:FlipV
語法:STYLE="filter:FlipV"
例子:filter:FlipV
7、濾鏡:glow
語法:STYLE="filter:Glow(Color=color, Strength=strength)"
說明:
Color:發光顏色。
Strength:強度(0-100)
例子:filter:Glow(Color="#6699CC",Strength="5")
8、濾鏡:gray
新聞熱點
疑難解答