Question

我在列表项（<li>）中有文本，我想将其旋转270度。在FireFox，Safari，Chrome和Opera中我们找到了直接的方法，但在IE的情况下，没有直接的支持。但是，有一些过滤器，例如matrix和BasicImage：我尝试了它们，但我没有到达任何地方。

例如，我正在做这样的事情：

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

它只旋转所有列表项的第一个字符

Answer 1

我猜这里，但可能是因为你只允许每个<li>有足够的宽度来显示第一个或第一个字符。它正确显示而没有旋转，因为文本正好溢出<li>的宽度。我遇到了一个类似的问题，即IE只会旋转容器宽度可见的文本。

如果你可以增加每个<li>的宽度而不会弄乱你的布局，那就去做吧，看看它是否有帮助。

Answer 2

请参阅：

Element Rotation (CSS Tranformations)

CSS3引入了许多转换和动画功能，有些人认为这些功能在CSS中不合适。尽管如此，有一种方法可以模仿Internet Explorer中的元素轮换，尽管方式有限。

THE SYNTAX

要将元素旋转180度（即垂直翻转），这里是CSS3语法：
#rotate {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
}
要在Internet Explorer中创建完全相同的旋转，请使用专有过滤器：
#rotate {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}
旋转的值可以是1,2,3或4.这些数字分别代表90度，180度，270度或360度旋转。

用于在IE中旋转文本的CSS

2 个答案:

THE SYNTAX