CSS3 transform：rotate;在IE9 [英] CSS3 transform: rotate; in IE9

问题描述

我有一个元素，需要在我做过的设计中是垂直的。我有CSS的这个工作在所有浏览器，除了IE9。我使用IE7& IE8：

  progid：DXImageTransform.Microsoft.BasicImage（rotation = 3）; 
  

这似乎在IE9渲染我的元素透明和CSS3'tranform'porperty似乎

有没有人知道IE9中的旋转元素？

真的很感谢您的帮助！ / p>

W。

解决方案

标准CSS3旋转在IE9中可以正常工作，我相信你需要给它一个供应商前缀，像这样：

  -ms-transform：rotate（10deg）; 
  

这可能无法在测试版中使用;如果没有，请尝试下载当前预览版本（预览7），这是beta的更新版本。我没有测试版的测试，所以我不能确认是否是在那个版本或不是。

我还可以确认IE特定的过滤器属性已在IE9中删除。

人们已要求进一步的文件。正如他们所说，这是相当有限，但我发现这个网页： http://css3please.com/ 这是

但是，在IE9预览中测试此页面上的旋转功能会导致它非常惊人地崩溃。

但是我在我自己的测试页面中使用 -ms-transform：rotate（）在IE9中做了一些独立的测试， 。所以我的结论是，该功能已实现，但有一些错误，可能与动态设置相关。

另一个有用的参考点，是www.canIuse.com - 请参阅 http://caniuse.com/#search=rotation

恢复这个旧的答案，因为我最近发现了一个名为 CSS砂纸，与问题相关，可以使事情变得更容易。

hack实现了对于旧版IE的标准CSS transform 的支持。现在你可以添加以下到你的CSS：

  -sand-transform：rotate（10deg）; 
  

...并且可以在IE 6/7/8中使用， code> filter 语法。 （当然它仍然在后台使用过滤器语法，但这使它更容易管理，因为它使用与其他浏览器类似的语法）

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);

This however seems to render my element transparent in IE9 and the CSS3 'tranform' porperty doesn't seem to do anything!

Does anyone know anyway of rotating elements in IE9?

Really appreciate the help!

W.

解决方案

Standard CSS3 rotate should work in IE9, but I believe you need to give it a vendor prefix, like so:

  -ms-transform: rotate(10deg);

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.

I can also confirm that the IE-specific filter property has been dropped in IE9.

[Edit]
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.

But testing the rotate feature on this page in IE9 preview caused it to crash fairly spectacularly.

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.

Another useful reference point for which features are implemented in which browsers is www.canIuse.com -- see http://caniuse.com/#search=rotation

[EDIT]
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.

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);

...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)

这篇关于CSS3 transform：rotate;在IE9的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！