一、transform
轉換工具：http://www.useragentman.com/IETransformsTranslator/
總結來源：http://blog.sina.com.cn/s/blog_42cdca7d010142m6.html
1）旋轉90/180/270度
1 .rot90 { 2 -moz-transform:rotate(90deg); 3 -webkit-transform:rotate(90deg); 4 transform:rotate(90deg); 5 filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1); 6 }
最后一句的"rotation=1"是關鍵，參數可以是0、1、2、3，除了這幾個數字以外，寫其他數字圖片都不會發生旋轉。
旋轉的角度只要將數值乘以90(π/2)，表示順時針旋轉90度，與transform:rotate(90deg);是一個意思。
2）旋轉任意角度
旋轉任意角度，只需記住下面這串代碼：
1 filter:progid:DXImageTransform.Microsoft.Matrix(M11=cos(roation),M12=-sin(roation),M21=sin(roation),M22=cos(roation),SizingMethod='auto expand');
示例:
1 #rot135 2 { 3 -moz-transform:rotate(135deg); 4 -webkit-transform:rotate(135deg); 5 transform:rotate(135deg); 6 filter:progid:DXImageTransform.Microsoft.Matrix(M11=-0.707,M12=-0.707,M21=0.707,M22=-0.707, 7 SizingMethod='auto expand'); 8 } 9 ```
如果只想旋轉135度，直接就是(cos(135) = -0.707)
1 filter:progid:DXImageTransform.Microsoft.Matrix(M11=-0.707,M12=-0.707,M21=0.707,M22=-0.707,SizingMethod='auto expand');
如果不僅想旋轉135度而且還想放大兩倍，那么M11/M12/M21/M22都乘以2：
1 filter:progid:DXImageTransform.Microsoft.Matrix(M11=-1.414,M12=-1.414,M21=0.1.414,M22=-1.414,SizingMethod='auto expand');
translate利用margin來實現
二、background-size
通過濾鏡來實現效果：
1 div { 2 background-image: url('https://www.cnblogs.com/images/logo_small.gif'); 3 background-size: cover; 4 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://www.cnblogs.com/images/logo_small.gif',sizingMethod='scale'); 5 }
注意兩處的路徑必須相同，並且是絕對路徑！