CSS濾鏡之Alpha濾鏡——透明度

在CSS中有一個Alpha濾鏡，這個濾鏡能夠設置目標元素的透明度。還能夠經過指定座標，從而實現各類不一樣範圍的透明度。css

具體語法以下：
{filter: alpha(opacity=#opacity,finishopacity=#finishopacity,style=#style,startx=#startx,starty=#starty,finishx=#finishx,finishy=#finishy)}

具體參數含義以下：
opacity 透明度。默認的範圍是從0 到 100，他們實際上是百分比的形式。也就是說，0表明徹底透明，100表明徹底不透明。
finishopacity 是一個可選參數，若是想要設置漸變的透明效果，就能夠使用他們來指定結束時的透明度。範圍也是0 到 100。
style   指定透明區域的形狀特徵：0 表明統一形狀，1 表明線形，2 表明放射狀，3 表明矩形
startx   漸變透明效果開始處的 X座標。只能style = 1纔有效
starty   漸變透明效果開始處的 Y座標。只能style = 1纔有效
finishx 漸變透明效果結束處的 X座標。  只能style = 1纔有效
finishy 漸變透明效果結束處的 Y座標。只能style = 1纔有效

以上的參數能夠選用，能夠只設置一個opacityhtml

實例： post

<html> orm

<head> htm

<title>alpha效果展現：</title>
<style type="text/Css"> //*定義CSS樣式*// blog

.half{filter:alpha(opacity=50)} //*透明度50，默認形狀*// ci

.s0{filter:alpha(opacity=30,style=0)} //*透明度30，統一形狀*// it

.s1{filter:alpha(opacity=80,style=1)} //*透明度80，線性透明*// form

.s2{filter:alpha(opacity=80,style=2)} //*透明度80，放射性*// class

.s3{filter:alpha(opacity=80,style=3)} //*透明度80，長方形*// </style>
</head>

<img class=s0 src="Sunset.jpg">

<img class=s1 src="Sunset.jpg">

<img class=s2 src="Sunset.jpg">

<img class=s3 src="Sunset.jpg">

</body>

</html>

注意：在濾鏡屬性中，每一個參數之間使用英文的逗號（,）分隔開，交換各個參數的位置，並不影響濾鏡的顯示效果。