1.Filter 屬性介紹 2.Alpha 濾鏡的使用 3.Blur 濾鏡的使用 4.Filph、Filpv 濾鏡 5.DropShadow 濾鏡 6.Glow 濾鏡 7.Gray ,Invert,Xray 濾鏡 8.Shadow 濾鏡 1 19.1 F Fr ilter 屬性介紹 設置或檢索對象所 ...
1.Filter 屬性介紹
2.Alpha 濾鏡的使用
3.Blur 濾鏡的使用
4.Filph、Filpv 濾鏡
5.DropShadow 濾鏡
6.Glow 濾鏡
7.Gray ,Invert,Xray 濾鏡
8.Shadow 濾鏡
1 19.1 F Fr ilter 屬性介紹
設置或檢索對象所應用的濾鏡或濾鏡集合。此屬性僅作用於有佈局的對象，如塊對象。
內聯要素要使用該屬性，必須先設定對象的 height 或 width 屬性，或者設定 position 屬
性為 absolute，或者設定 display 屬性為 block。請參閱對象的 hasLayout 屬性。若要在
img 對象上應用 shadow 濾鏡，可以在該對象 img 對象的父容器上應用。濾鏡的機制是可擴
展的。通過利用 Microsoft® DirectX® Media SDK，你可以使用 C++開發和使用第三方濾鏡 。
該屬性在 MAC 平臺上不可用。對應的腳本特性為 filter。
2 19.2 a Alpha 濾鏡的使用
屬性 值 說明
opacity 0-100 對象的亮度
style 1,2,3 濾鏡的樣式
2 19.2 r Blur 濾鏡的使用
屬性 值 說明
add true/false 是否印象派
direction 0-360 角度
strength 數字 模糊度
3 19.3 Fliph 、 Flipv 濾鏡
屬性 值 說明
無
4 19.4 w DropShadow 濾鏡
屬性 值 說明
color 顏色 陰影顏色
offx 數字 x 坐標偏移
offy 數字 y 坐標偏移
positive true/false 是否建立透明
19.5 5 w Glow 濾鏡
屬性 值 說明
color 顏色 發光顏色
strength 數字 發光厚度
6 19.6 y Gray y ,Invert,Xray 濾鏡
屬性 值 說明
無
7 19.7 w Shadow 濾鏡
屬性 值 說明
color 顏色 陰影顏色
direction 0-360 陰影方向
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
<style type="text/css">
div{
background: orange;
width:200px;
height:150px；
}
img{
filter: alpha(style=2,opacity=70);
}
</style>
</head>
<body>
<div>濾鏡的使用</div>
<img src="images/pic7.jpg"/>
</body>
</html>
