使用bootstrap 3我正在尝试这个exameple，在li元素中使用class =“active”。不幸的是，当页面最初显示时没有显示任何标签窗格，整个标签内容都是空的。选项卡导航显示正确，当我明确地点击选项卡时，显示正确的窗格。如何使默认引导程序3选项卡导航激活？

我缺少什么？

在此先感谢。

<ul class="nav nav-tabs"> 
    <li class="active"><a href="#graduation" data-toggle="tab">graduation</a></li> 
    <li><a href="#graduate" data-toggle="tab">graduate</a></li> 
    <li><a href="#extension" data-toggle="tab">extension</a></li> 
</ul> 
<div class="tab-content" id="TabContent"> 
    <div class="tab-pane fade" id="graduation"> 
     <p> 
      anything 
     </p> 
    </div> 
    <div class="tab-pane fade" id="graduate"> 
     <p> 
      graduate 
     </p> 
    </div> 
    <div class="tab-pane fade" id="extension"> 
     <p> 
      extension 
     </p> 
    </div> 
</div>

来源

2014-09-25 g.pickardou

您还需要指定默认tab-pane的active类（和衰落选项卡，你需要添加in类），因此，你应该改变

<div class="tab-pane fade" id="graduation">

到

<div class="tab-pane fade in active" id="graduation">

来源

2014-09-25 22:56:24

由于仅此而已。有趣的是，有多少没有工作的样本在这里。 – 2014-09-25 23:05:28

我总是使用[官方文档]（http://getbootstrap.com/javascript/#tabs），除非它是我无法在其中找到的东西。 – 2014-09-25 23:11:03

对于任何正在寻找引导答案的人4

自举4

<div class="tab-pane fade show active" id="graduation"> 
<div class="tab-pane fade" id="graduation">

相比自举3

<div class="tab-pane fade in active" id="graduation"> 
<div class="tab-pane fade in" id="graduation">

来源

2018-01-03 18:04:25

如何使默认引导程序3选项卡导航激活？

回答

对于任何正在寻找引导答案的人4

相关问题