問題描述
在我所做的設(shè)計中,我有一個元素需要垂直.我已經(jīng)得到了可以在除 IE9 之外的所有瀏覽器中使用的 css.我為 IE7 & 使用了過濾器.IE8:
I have an element that needs to be vertical in a design I have done. I have got the css for this to work in all browsers except IE9. I used the filter for IE7 & IE8:
progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
然而,這似乎使我的元素在 IE9 中變得透明,而 CSS3 的轉(zhuǎn)換"屬性似乎沒有做任何事情!
This however seems to render my element transparent in IE9 and the CSS3 'tranform' porperty doesn't seem to do anything!
有誰知道 IE9 中的旋轉(zhuǎn)元素?
Does anyone know anyway of rotating elements in IE9?
非常感謝您的幫助!
W.
推薦答案
標(biāo)準(zhǔn)的 CSS3 旋轉(zhuǎn)應(yīng)該可以在 IE9 中工作,但我相信你需要給它一個供應(yīng)商前綴,像這樣:
Standard CSS3 rotate should work in IE9, but I believe you need to give it a vendor prefix, like so:
-ms-transform: rotate(10deg);
它可能無法在 beta 版本中運行;如果沒有,請嘗試下載當(dāng)前的預(yù)覽版(預(yù)覽版 7),這是 beta 的更高版本.我沒有要測試的 beta 版本,所以我無法確認(rèn)它是否在那個版本中.最終發(fā)布版本肯定會支持它.
It is possible that it may not work in the beta version; if not, try downloading the current preview version (preview 7), which is a later revision that the beta. I don't have the beta version to test against, so I can't confirm whether it was in that version or not. The final release version is definitely slated to support it.
我還可以確認(rèn) IE 特定的 filter
屬性已在 IE9 中被刪除.
I can also confirm that the IE-specific filter
property has been dropped in IE9.
人們要求提供一些進(jìn)一步的文件.正如他們所說,這是非常有限的,但我確實找到了這個頁面: http://css3please.com/ 這是可用于在所有瀏覽器中測試各種 CSS3 功能.
People have asked for some further documentation. As they say, this is quite limited, but I did find this page: http://css3please.com/ which is useful for testing various CSS3 features in all browsers.
但在 IE9 預(yù)覽版中測試此頁面上的旋轉(zhuǎn)功能導(dǎo)致它相當(dāng)嚴(yán)重地崩潰.
But testing the rotate feature on this page in IE9 preview caused it to crash fairly spectacularly.
但是,我在自己的測試頁面中使用 IE9 中的 -ms-transform:rotate()
進(jìn)行了一些獨立測試,并且工作正常.所以我的結(jié)論是該功能已實現(xiàn),但存在一些錯誤,可能與動態(tài)設(shè)置有關(guān).
However I have done some independant tests using -ms-transform:rotate()
in IE9 in my own test pages, and it is working fine. So my conclusion is that the feature is implemented, but has got some bugs, possibly related to setting it dynamically.
另一個有用的參考點是 www.canIuse.com ——參見 http://caniuse.com/#search=rotation
Another useful reference point for which features are implemented in which browsers is www.canIuse.com -- see http://caniuse.com/#search=rotation
恢復(fù)這個舊答案是因為我最近發(fā)現(xiàn)了一個名為 CSS Sandpaper 與問題相關(guān),可能會使事情變得更容易.
Reviving this old answer because I recently found out about a hack called CSS Sandpaper which is relevant to the question and may make things easier.
該 hack 實現(xiàn)了對舊版本 IE 的標(biāo)準(zhǔn) CSS transform
的支持.所以現(xiàn)在您可以將以下內(nèi)容添加到您的 CSS 中:
The hack implements support for the standard CSS transform
for for old versions of IE. So now you can add the following to your CSS:
-sand-transform: rotate(10deg);
...讓它在 IE 6/7/8 中工作,而無需使用 filter
語法.(當(dāng)然它仍然在后臺使用過濾器語法,但這使得它更容易管理,因為它使用與其他瀏覽器類似的語法)
...and have it work in IE 6/7/8, without having to use the filter
syntax. (of course it still uses the filter syntax behind the scenes, but this makes it a lot easier to manage because it's using similar syntax to other browsers)
這篇關(guān)于CSS3 變換:旋轉(zhuǎn);在 IE9 中的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網(wǎng)!