一、Matrix濾鏡簡介
基本語法如下：

filter: progid:DXImageTransform.Microsoft.Matrix( enabled= bEnabled , SizingMethod= sMethod , FilterType= sType , Dx= fDx , Dy= fDy , M11= fM11 , M12= fM12 , M21= fM21 , M22= fM22 )

其中參數多多，而且名稱稀奇古怪的，很容易嚇著新手。所以我干脆直接簡化了下，把與實現旋轉與縮放功能不相關的不需要關系的參數全部一腳踹掉，于是有：

filter: progid:DXImageTransform.Microsoft.Matrix( SizingMethod= sMethod , M11= fM11 , M12= fM12 , M21= fM21 , M22= fM22 )

其中SizingMethod這里死活就是"auto expand"了，也就是說我們要實現元素的旋轉與縮放只要關心M11, M12, M21, M22，這幾個參數就是2×2矩陣中的的四個數值。雖然大學中學過線性代數還考了90多分，但是幾年不碰都已經還給老師了，所以這幾個參數如何實現拉伸我也是不清楚的。但是，幸好實現旋轉以及縮放效果我們不需要知道的太多，我們只需要套用下面的格式就可以了。

filter:progid:DXImageTransform.Microsoft.Matrix(M11=cos(roation),M12=-sin(roation),M21=sin(roation),M22=cos(roation),SizingMethod=’auto expand’);

只要把你需要旋轉的角度將上面的roation值代替并計算出來就可以了，這個在“圖片旋轉效果的一些研究、jQuery插件及實例” 一文中已經有過介紹了，這里就不贅述了。現在來看看如何實現比例的縮放。
如同變魔術般，一旦知道了原理就覺得很一般。同樣的這里實現比例的改變也非常簡單。就是將M11, M12, M21, M22的每個值分別乘以你希望縮放的比例就可以了。
例如，您想要把一個元素只是單純的旋轉135度的話直接就是(cos(135) = -0.707)：

filter:progid:DXImageTransform.Microsoft.Matrix(M11=-0.707,M12=-0.707,M21=0.707,M22=-0.707,SizingMethod=’auto expand’);}

但是，同時你希望元素還放大兩倍，那該怎么辦呢，很簡單，M11, M12, M21, M22同時乘以2就可以了，也就是：

filter:progid:DXImageTransform.Microsoft.Matrix(M11=-1.414,M12=-1.414,M21=0.1.414,M22=-1.414,SizingMethod=’auto expand’);}

很簡單吧。這就是IE矩陣濾鏡Matrix下旋轉與縮放的實現。

二、與CSS3 transform的結合
CSS3 transform中有旋轉(ratate)和縮放(scale)屬性，詳細可參見“CSS3 Transitions, Transforms和Animation使用簡介與應用展示”一文。
例如實現上面所說的旋轉135度，同時放大2倍的效果代碼應該是：

transform:rotate(135deg) scale(2);

于是，我們將IE的Matrix濾鏡和CSS3的transform屬性結合舊可以實現絕大多數瀏覽器的元素旋轉與縮放效果了。現在有個問題是Matrix濾鏡的使用與計算，你說我要是旋轉個75度，難道還要打開計算器去計算嗎，而且filter后面長得很深奧的字符語法讓人不容易記住，很折騰人的。這個問題已經有人想到了，在American，有兩位前端開發者Zoltan Hawryluk 和Zoe Mickley Gillenwater就這個問題寫了個工具，專門講CSS3中簡單易懂的transform屬性值轉換成IE的Matrix濾鏡表示形式，此工具地址是：http://www.useragentman.com/IETransformsTranslator/。直接點擊頁面上“Translate to IE Matrix”這個按鈕就好了，如下圖：