使用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

相關問題