1

我想在 IE7 和 IE8 浏览器中使用 css 转换来旋转跨度文本。

<SPAN style="FONT-SIZE: 14px; -ms-transform:rotate(-90deg);   FONT-FAMILY: Segoe UI; POSITION: absolute; ZOOM: 1; COLOR: #707070; LEFT: -64px;  TOP: 234px; VISIBILITY: visible">Sales Amount in millions(USD)
</SPAN>

上面的代码将在 IE9+ 和其他浏览器中旋转文本。但是我如何旋转可以在 IE7 和 IE8 浏览器中使用的跨度文本。

过滤以支持旧版本

如何使用过滤器旋转跨度元素？

谢谢，

湿婆

4

3 回答 3

3 
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

BasicImage 过滤器的旋转属性可以接受以下四个值之一：0、1、2 或 3，它们将分别将元素旋转 0、90、180 或 270 度。

于 2013-09-05T10:16:31.983 回答
3

css 的一些新属性可以通过 IE 的 filter 属性来实现。例如，如果您想进行比例变换，请使用：

-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
-o-transform: scale(1.05);

等非 IE 浏览器的扩展。但是如果你想在 IE 8 或更早版本上使用它。你应该做这个：

filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.05,M12=0,M21=0,M22=1.05,SizingMethod='auto expand');
于 2013-09-05T10:27:50.000 回答
1

您可以使用从 IE 9 开始弃用的矩阵过滤。此外，正如他们在此链接上提到的：http: //msdn.microsoft.com/en-us/library/ms533014 (v=vs.85).aspx

Resizes, rotates, or reverses the content of the object using matrix transformation.

这是另一个让您更轻松的链接：http: //www.boogdesign.com/examples/transforms/matrix-calculator.html

90度旋转示例：

-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);
于 2013-09-05T10:20:33.797 回答