带有垂直文字的Twitter标签

Question

我使用twitter-bootstrap来创建界面。 但我不知道如何创建tab-widget与垂直文本。 对于我使用的文字变换：

-moz-transform:rotate(270deg); 
-moz-transform-origin: bottom left; 
-webkit-transform: rotate(270deg); 
-webkit-transform-origin: bottom left; 
-o-transform: rotate(270deg); 
-o-transform-origin: bottom left; 
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); 

谢谢。

Answer 1

添加自定义类。

HTML：

<div class="letterP3">Hello</div> 

CSS：

.letterP3 {  
    -webkit-transform: rotate(90deg); 
    -moz-transform: rotate(90deg); 
     -ms-transform: rotate(90deg); 
     -o-transform: rotate(90deg); 
      transform: rotate(90deg); 
      color: #000; 
      font-size: 22px;     
      height: 200px; 
      width: 200px; 
      float: left;   
      vertical-align:top;  
} 

http://jsfiddle.net/hellosze/8Rc27/

和CSS3工具：

http://www.css3maker.com/text-rotation.html

Answer 2

@ lito - 我已经实现了左/右垂直引导标签here - 您描述的文字旋转。希望这可以帮助。