CSS濾鏡簡要
CSS濾鏡屬性表:
濾鏡效果 | 描述 |
Alpha | 設置透明度 |
Blru | 建立模糊效果 |
Chroma | 把指定的顏色設置為透明 |
DropShadow | 建立一種偏移的影象輪廓,即投射陰影 |
FlipH | 水平反轉 |
FlipV | 垂直反轉 |
Glow | 為對象的外邊界增加光效 |
Grayscale | 降低圖片的彩色度 |
Invert | 將色彩、飽和度以及亮度值完全反轉建立底片效果 |
Light | 在一個對象上進行燈光投影 |
Mask | 為一個對象建立透明膜 |
Shadow | 建立一個對象的固體輪廓,即陰影效果 |
Wave | 在X軸和Y軸方向利用正弦波紋打亂圖片 |
Xray | 只顯示對象的輪廓 |
1、Alpha 濾鏡
語法:{FILTER:ALPHA(opacity=opacity,finishopacity=finishopacity,style=style,startx=startx,
starty=starty,finishx=finishx,finishy=finishy)}
2、Blur 濾鏡
語法:對于HTML:{filter:blur(add=add,direction=direction,strength=strength)}
對于Script語言: [oblurfilter=] object.filters.blur
模糊效果
3、FlipH, FlipV 濾鏡
語法:{filter:filph} ,{filter:filpv} 分別是水平反轉和垂直反轉
4、Chroma 濾鏡
語法:{filter:chroma(color=color)}
使用”Chroma"屬性可以設置一個對象中指定的顏色為透明色,參數COLOR即要透明的顏色。下面是蘭色文字,然后用Chroma 濾鏡過濾掉蘭色,就成了下面的樣子。
5、DropShadow 濾鏡
語法:{filter:dropshadow(color=color,offx=ofx,offy=offy,positive=positive)}
“DropShaow"顧名思義就是添加對象的陰影效果。
6、Glow 濾鏡
語法:{filter:glow(color=color,strength)}
當對一個對象使用"glow"屬性后,這個對象的邊緣就會產生類似發光的效果。“COLOR”是指定發光的顏色,“STRENGTH”則是強度的表現,可以從1到255之間的任何整數來指定這個力度。如filter:glow(color=red,strength=10)
7、Gray ,Invert,Xray 濾鏡
語法:{filter:gray} ,{filter:invert},{filter:xray}
Gray濾鏡是把一張圖片變成灰度圖;Invert濾鏡是把對象的可視化屬性全部翻轉,包括色彩、飽和度、和亮度值;Xray濾鏡是讓對象反映出它的輪廓并把這些輪廓加亮,也就是所謂的“X”光片。
8、Light 濾鏡
語法:Filter{light}
這個屬性模擬光源的投射效果。一旦為對象定義了“LIGHT"濾鏡屬性,那么就可以調用它的“方法(Method)"來設置或者改變屬性。
9、Mask 濾鏡
語法:{filter:mask(color=color)}
使用"MASK"屬性可以為對象建立一個覆蓋于表面的膜,其效果就象戴者有色眼鏡看物體一樣。
10、Shadow 濾鏡
語法:{filter:shadow(color=color,direction=direction)}
11、Wave 濾鏡:
語法:{filter:wave(add=add,freq=freq,lightstrength=strength,phase=phase,strength=strength)}
"wave" 屬性把對象按垂直的波形樣式打亂。默認是“TRUE(非0)”,
“ADD”表示是否要把對象按照波形樣式打亂,
“FREQ”是波紋的頻率,也就是指定在對象上一共需要產生多少個完整的波紋,
“LIGHTSTRENGTH”參數可以對于波紋增強光影的效果,范圍0----100,
“PHASE”參數用來設置正弦波的偏移量。
“STRENGTH”代表振幅大小。
posted on 2008-12-15 11:48 小卓 閱讀(265) 評論(0) 編輯 收藏 所屬分類: html and js