我如何獲得引導選項卡左以在引導3.3.x中工作

Question

我注意到左邊的nav-tabs在Bootstrap 3.3.0,3.3.2中不起作用，如果有人知道如何重新啟用該樣式，它會在徘徊。 標簽應上下運行，並在右側選擇內容。

Working bootstrap2.3.2 BIN：

http://jsbin.com/vimekuloqo/4/edit

這是無法正常工作的3.3.0鏈接：

http://jsbin.com/wituxucuja/1/edit

相關代碼（直接來自http://getbootstrap.com/2.3.2/components.html#navs ）

          <ul class="nav nav-tabs">
            <li class="active"><a href="#lA" data-toggle="tab">Section 1</a></li>
            <li class=""><a href="#lB" data-toggle="tab">Section 2</a></li>
            <li class=""><a href="#lC" data-toggle="tab">Section 3</a></li>
          </ul>

          <div class="tab-content">
            <div class="tab-pane active" id="lA">
              <p>I'm in Section A.</p>
            </div>
            <div class="tab-pane" id="lB">
              <p>Howdy, I'm in Section B.</p>
            </div>
            <div class="tab-pane" id="lC">
              <p>What up girl, this is Section C.</p>
            </div>
          </div>
        </div>

...

<script language=javascript>
$('#myTab a').click(function (e) {
    if($(this).parent('li').hasClass('active')){
        $( $(this).attr('href') ).hide();
    }
    else {
        e.preventDefault();
        $(this).tab('show');
    }
});
</script>

Answer 1

本文提供了完整的代碼答案，並通過以下方式演示了該頁面： http : //tutsme-webdesign.info/bootstrap-3-toggable-tabs-and-pills/

簡單的答案是，您需要將.nav-stacked添加到<ul> ，然后使用常規的行/列系統進行布局。 BS3不像BS2那樣本身就支持浮動選項卡。

http://jsbin.com/kobegaguwa/1/edit

請注意，對於jsbin預覽，您需要使用xs列，否則它將以響應方式將所有內容堆疊在1列中。

默認樣式不適用於標簽，但可以用於葯丸。