如何旋轉文本並將其放入Bootstrap列中？

我在尋找整天計算器辦法轉動我的文字，但是當我添加的自舉列的東西，它只是打破...如何旋轉文本並將其放入Bootstrap列中？

我正在寫有2個colums的標題和10列的頁面內容。

標題文本應該是一個垂直文本，沿着盒子高度，內容應該是任何文本或img。

這裏是HTML/CSS，我已經寫了：

<div class="container"> 
<div class="row" style="height: 350px;"> 
    <div class="col-xs-2"> 
     <div class="vertical-text"> 
      <h3>some text</h3> 
     </div> 
    </div> 
    <div class="col-xs-10"> 
     <div class="some-img"></div> 
     <div class="some-text"> 
      <p>blablablabla</p> 
      <p>blablablabla</p> 
      <p>blablablabla</p> 
     </div> 
    </div> 
</div>

.vertical-text { 
    transform: rotate(90deg); 
    background: green; 
} 

.row { padding: 15px; }

的jsfiddle的問題：http://jsfiddle.net/cxhmssam/1/

來源

2015-11-03 gbrennon

我不明白你的問題是什麼。你的小提琴顯示旋轉的文字。如果你正在尋找IE9，那麼它需要一個供應商前綴，以及Safari 8：http://caniuse.com/#search=transform – Shane

你的jsfiddle顯示「一些文本」爲垂直我。

正如@Shane所建議的那樣，您可能想嘗試-ms-transform。

報價w3schools：

div { 
    -ms-transform: rotate(7deg); /* IE 9 */ 
    -webkit-transform: rotate(7deg); /* Chrome, Safari, Opera */ 
    transform: rotate(7deg); 
}

來源

2015-11-03 21:10:26

如何旋轉文本並將其放入Bootstrap列中？

回答

相關問題