我對圖形變換濾鏡的收集（CSS漸層濾鏡大全）

我對圖形變換濾鏡的收集（CSS漸層濾鏡大全）

<!--圖型變換代碼如下. 

    23.隨機變換效果            type="progid:DXImageTransform.Microsoft.RevealTrans(enabled=ture,transition=23)"
       
       0.方形逐漸層小            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=square,motion=in)"
        交叉形逐漸層大        type="progid:DXImageTransform.Microsoft.Iris(irisstyle=cross,motion=out)"
        菱形逐漸層小            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=diamond,motion=in)"

       1.方形逐漸層大            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=square,motion=out)"
        交叉形逐漸層小        type="progid:DXImageTransform.Microsoft.Iris(irisstyle=cross,motion=in)"
        菱形逐漸層大            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=diamond,motion=out)"
                               
       2.圓形逐漸層小            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=circle,motion=in)"
        加號形逐漸層大        type="progid:DXImageTransform.Microsoft.Iris(irisstyle=plus,motion=out)"
        星形逐漸層小            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=star,motion=in)"

       3.圓形逐漸層大            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=circle,motion=out)"
        加號形逐漸層小        type="progid:DXImageTransform.Microsoft.Iris(irisstyle=plus,motion=in)"
        星形逐漸層大            type="progid:DXImageTransform.Microsoft.Iris(irisstyle=star,motion=out)"
       
       4.向上逐漸擦除            type="progid:DXImageTransform.Microsoft.Blinds(bands=1,direction=up)"
       
       5.向下逐漸擦除            type="progid:DXImageTransform.Microsoft.Blinds(bands=1,direction=down)"
       
       6.向左逐漸擦除            type="progid:DXImageTransform.Microsoft.Blinds(bands=1,direction=left)"
       
       7.向右逐漸擦除            type="progid:DXImageTransform.Microsoft.Blinds(bands=1,direction=right)"
       
       8.垂直百葉窗效果        type="progid:DXImageTransform.Microsoft.Blinds(bands=6,direction=right)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=6,direction=left)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=60,direction=right)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=60,direction=left)"
       
       9.水平百葉窗效果        type="progid:DXImageTransform.Microsoft.Blinds(bands=6,direction=down)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=6,direction=up)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=60,direction=down)"
                               type="progid:DXImageTransform.Microsoft.Blinds(bands=60,direction=up)"
               
       10.橫向棋盤效果            type="progid:DXImageTransform.Microsoft.CheckerBoard(direction=down,squaresX=12,squaresY=12)"
                               type="progid:DXImageTransform.Microsoft.CheckerBoard(direction=up,squaresX=12,squaresY=12)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=down,squaresX=2,squaresY=2)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=up,squaresX=2,squaresY=2)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=down,squaresX=60,squaresY=60)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=up,squaresX=60,squaresY=60)"
               
       11.縱向棋盤效果            type="progid:DXImageTransform.Microsoft.CheckerBoard(direction=right,squaresX=12,squaresY=12)"
                               type="progid:DXImageTransform.Microsoft.CheckerBoard(direction=left,squaresX=12,squaresY=12)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=right,squaresX=2,squaresY=2)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=left,squaresX=2,squaresY=2)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=right,squaresX=60,squaresY=60)"
                               type="progid:DXImageTransform.Microsoft.Checkerboard(direction=left,squaresX=60,squaresY=60)"
           
       12.隨機溶解效果            type="progid:DXImageTransform.Microsoft.RandomDissolve(enable=true)"
       
       13.左右向中部收縮        type="progid:DXImageTransform.Microsoft.Barn(motion=in,orientation=vertical)"
       
       14.中部向左右展開        type="progid:DXImageTransform.Microsoft.Barn(motion=out,orientation=vertical)"
       
       15.上下向中部收縮        type="progid:DXImageTransform.Microsoft.Barn(motion=in,orientation=horizontal)"
       
       16.中部向上下展開        type="progid:DXImageTransform.Microsoft.Barn(motion=out,orientation=horizontal)"
       
       17.階梯狀向左下展開        type="progid:DXImageTransform.Microsoft.Strips(motion=leftdown)"
       
       18.階梯狀向左上展開        type="progid:DXImageTransform.Microsoft.Strips(motion=leftup)"
       
       19.階梯狀向右下展開        type="progid:DXImageTransform.Microsoft.Strips(motion=rightdown)"
       
       20.階梯狀向右上展開        type="progid:DXImageTransform.Microsoft.Strips(motion=rightup)"
       
       21.隨機水平線效果        type="progid:DXImageTransform.Microsoft.RandomBars(orientation=horizontal)"
       
       22.隨機垂直線效果        type="progid:DXImageTransform.Microsoft.RandomBars(orientation=vertical)"
       
       24.標準漸層轉化效果        type="BlendTrans(enabled=true,percent=10)"
       
       25.可調漸層轉化效果        type="progid:DXImageTransform.Microsoft.Fade(enabled=ture,overlap=1.0)"
       
       26.向右下插入效果        type="progid:DXImageTransform.Microsoft.Inset(enabled=ture)"
       
       27.馬賽克效果            type="progid:DXImageTransform.Microsoft.Pixelate(maxSquare=20)"
       
       28.時鐘形射線擦除        type="progid:DXImageTransform.Microsoft.RadialWipe(wipestyle=clock)"
       29.楔子形射線擦除        type="progid:DXImageTransform.Microsoft.RadialWipe(wipestyle=wedge)"
       30.輻射形射線擦除        type="progid:DXImageTransform.Microsoft.RadialWipe(wipestyle=radial)"
       
       31.隱藏式投影片效果        type="progid:DXImageTransform.Microsoft.Slide(slidestyle=hide,bands=1)"
                               type="progid:DXImageTransform.Microsoft.Slide(slidestyle=hide,bands=20)"
       32.推動式投影片效果        type="progid:DXImageTransform.Microsoft.Slide(slidestyle=push,bands=1)"
                               type="progid:DXImageTransform.Microsoft.Slide(slidestyle=push,bands=20)"
       33.交換式投影片效果        type="progid:DXImageTransform.Microsoft.Slide(slidestyle=swap,bands=1)"
                               type="progid:DXImageTransform.Microsoft.Slide(slidestyle=swap,bands=20)"
       
       34.螺旋形收縮效果        type="progid:DXImageTransform.Microsoft.Spiral(gridSizeX=20,gridSizeY=20)"
       
       35.隱藏式伸展效果        type="progid:DXImageTransform.Microsoft.Stretch(stretchstyle=hide)"
       36.推動式伸展效果        type="progid:DXImageTransform.Microsoft.Stretch(stretchstyle=push)"
       37.旋轉式伸展效果        type="progid:DXImageTransform.Microsoft.Stretch(stretchstyle=spin)"
       
       38.風車輪轉動效果        type="progid:DXImageTransform.Microsoft.Wheel(spokes=20)"
       
       39.梯度擦除效果            type="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.5,wipestyle=0,motion=forward)"
                               type="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.5,wipestyle=0,motion=reverse)"
                               type="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.5,wipestyle=1,motion=forward)"
                               type="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.5,wipestyle=1,motion=reverse)"

       40.Z字形曲折效果        type="progid:DXImageTransform.Microsoft.Zigzag(gridSizeX=20,gridSizeY=20)"

-->
注:頭23個濾鏡（指有標號的）是常見濾鏡，均可用第23號濾鏡（排在文章中的第一種濾鏡）變換參數獲得。如1號濾鏡可以將23號濾鏡中的transition=23改為transition=1，其餘同。