如何將jQuery UI選項卡設置爲垂直？

我正在使用jQuery Ui標籤：http://jqueryui.com/tabs/如何將jQuery UI選項卡設置爲垂直？

但我想設置這樣的Tab，我怎麼能做到這一點？

enter image description here

what i tired is：http://jsfiddle.net/s766A/

2012-11-14 ALAN

我會在這裏http://jqueryui.com/tabs/#vertical開始，但如果你想旋轉你需要CSS3文本轉換爲迴轉。 – nxtwrld

.rotation-text {{0} {0} {0} -moz-transform：rotate（-270deg）; -moz-transform-origin：左下; -webkit-transform：rotate（-270deg）; -webkit-transform-origin：左下角; -o-transform：rotate（-270deg）; -o-transform-origin：左下; filter：progid：DXImageTransform.Microsoft.BasicImage（rotation = 1）; } – anhtuannd

use this css 
<style> 
.ui-tabs-vertical { width: 55em; } 
.ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 12em; } 
.ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0; } 
.ui-tabs-vertical .ui-tabs-nav li a { display:block; } 
.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; } 
.ui-tabs-vertical .ui-tabs-panel { padding: 1em; float: right; width: 40em;} 
</style>

來源

2012-11-14 09:27:00 abc

還有水平文本。我在這裏找到了類似的例子：http：//keith-wood.name/uiTabs.html。 – anhtuannd

你不明白我的問題，我不需要水平文本：D – ALAN

這不是橫向文本。這個CSS將從上到下設置標籤。在http://jqueryui.com/tabs/ – abc

如何將jQuery UI選項卡設置爲垂直？

回答

相關問題