我如何获得引导选项卡左以在引导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列中。

默认样式不适用于标签，但可以用于药丸。