CSS3變換：規模IE

Question

我想使用CSS3屬性變換：規模。

div 
{ 
    transform: scale(0.5,0.5); 
} 

有沒有辦法在Internet Explorer 8及更低版本中模仿這個？ 可能是filter或Javascript解決方案？

我在網上搜索沒有任何結果。

非常感謝，文森特

Answer 1

IE9支持變換：

-ms-transform: scale(0.5,0.5); 

對於其他版本的IE，有一個複雜的語法。類似這樣的：

filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', 
    M11=1.5320888862379554, M12=-1.2855752193730787, 
    M21=1.2855752193730796, M22=1.5320888862379558); 

請看here瞭解更多信息。

Answer 2

http://msdn.microsoft.com/en-us/library/ms533014(v=vs.85).aspx

雖然，在IE瀏覽器的過濾器是不容易使用，他們並不總是與其他CSS特效結合....

但IE 9支持規模 https://developer.mozilla.org/en/CSS/transform

Answer 3

沒有，IE8和更早的版本不支持標準transform風格。雖然IE9支持它。

有解決方案，您可以嘗試使用filter風格，但他們會亂碼。

但對於你的問題描述的簡單情況（基本上是一個簡單的按比例縮小），你可以使用IE專有zoom財產。

由於它是非標準的，zoom最常見的用途是zoom:1，它用於修復一些IE的佈局故障（特別是在IE6和IE7中）。但它也可以進行實際縮放，您可以使用zoom:0.5來實現您要查找的效果。

關於使用zoom的好處是，它可以像任何其他普通的CSS屬性一樣在IE中使用（filter替代品有一些您需要了解的嚴重渲染怪癖）。

使用zoom唯一不利的方面是您需要在IE9或更高版本中禁用它，否則它會與您的transform風格相互影響併產生一些不需要的效果。我不是一個普遍支持使用CSS黑客，但你可以使用/9黑客（documented here），使其隻影響IE8和更早的版本，這意味着你可以指定transform，並在同一個樣式表的zoom兩個，像這樣：

div { 
    transform: scale(0.5,0.5); 
    zoom: 0.5\9; 
} 

否則，您需要使用條件註釋來決定是否使用它。

顯然，如果你想做比簡單的比例尺更復雜的任何事情，那麼zoom將不適合，但對於一個簡單的例子，就像你的問題中的那個，它將是完美的。

Answer 4

試試這個： https://github.com/pbakaus/transformie