CSS3文字旋转

Question

如何使用CSS3 text-rotate实现以下功能

我正在寻找使用2个浮动元素（一个只有文本，另一个用于右面板）和一个容器..

任何使其在IE8中工作的解决方法也将受到赞赏..

Answer 1

采用

-webkit-transform:rotate(-90deg);
-moz-transform:rotate(-90deg);
-ms-transform:rotate(-90deg);
-o-transform:rotate(-90deg);
transform:rotate(-90deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

在元素上。 （可能是90，而不是-90 - 你必须检查！）。 IE只需要1,2,3,4的值代表每个90˚旋转。

Answer 2

检查这个http://snook.ca/archives/html_and_css/css-text-rotation

写这样的

-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);

＆对于IE，您可以使用过滤器

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

检查小提琴http://jsfiddle.net/sandeep/w7vZd/12/

＆对于IE8，你可以条件评论或IE css hacks。