3

我正在尝试使用以下代码将文本旋转到 270 度:

/* Safari */
-webkit-transform: rotate(-90deg);

/* Firefox */
-moz-transform: rotate(-90deg);

/* IE */
-ms-transform: rotate(-90deg);

/* Opera */
-o-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

它适用于所有浏览器,但不适用于 IE8。我究竟做错了什么?

4

3 回答 3

6

尝试使用这个:

-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.00000000, M12=1.00000000, M21=-1.00000000, M22=0.00000000,sizingMethod='auto expand')";
filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.00000000, M12=1.00000000, M21=-1.00000000, M22=0.00000000,sizingMethod='auto expand');

-moz-transform:  matrix(0.00000000, -1.00000000, 1.00000000, 0.00000000, 0, 0);

-webkit-transform:  matrix(0.00000000, -1.00000000, 1.00000000, 0.00000000, 0, 0);

-o-transform:  matrix(0.00000000, -1.00000000, 1.00000000, 0.00000000, 0, 0);
于 2012-08-10T11:41:58.827 回答
5

IE 使用另一个过滤器来旋转元素。

在这里你可以阅读它 http://msdn.microsoft.com/en-us/library/ms533014(v=vs.85).aspx

在这里您可以轻松计算旋转矩阵的系数http://www.boogdesign.com/examples/transforms/matrix-calculator.html 只需输入度数,它将生成所需的代码

您只需添加一行代码:

-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-0.00000000, M12=1.00000000, M21=-1.00000000, M22=-0.00000000,sizingMethod='auto expand')";
于 2012-08-10T11:41:13.380 回答
1

IE8 不支持这个 CSS 元素。

请参阅:http ://social.msdn.microsoft.com/Forums/eu/iewebdevelopment/thread/9b21a3c2-6bdf-4aad-a90d-868bdeb3d866

如果你只是在 IE8+ 中旋转元素,你仍然需要一个跨浏览器的方法。这是因为从 IE9 开始不推荐使用 IE 过滤器,IE9 现在支持 CSS3 -ms-transform 属性。但是,对于 IE8 及更早版本,需要使用 BasicImage 等滤镜才能达到效果。因此,为了迎合当前使用的版本以及未来的变化,一种谨慎的方法可能是通过条件注释将过滤器提供给 IE8 和更早版本,否则使用转换集来迎合当前浏览器。

于 2012-08-10T11:41:50.443 回答