jQuery Tabs in Bootstrap

Question

So habe ich eine Desktop-Version meiner Website und eine mobile Version. Die mobile Version verwendet Bootstrap für seine Reaktionsfähigkeit. In den Foren habe ich eine bbcode die jQuerys Tabs Widget so die HTML-Struktur wie folgt verwendet wird:

<div class="tabs_wrap"> 
<ul class="forum_tabs"> 
<li><a href="#">Tab1</a></li> 
<li><a href="#">Tab2</a></li> 
</ul> 
<div class="tabspane"> 
content for tab1 
</div> 
<div class="tabspane"> 
content for tab2 
</div> 

Aber in Bootstrap dies nicht funktioniert, weil die Registerkarten verschiedene CSS-Klassen verwenden und die Panels sind in einem anderen Div. Gibt es einen Weg, wie ich es schaffen könnte, ohne den HTML-Code zu ändern?

Answer 1

Sie wissen, dass Regeln für die Verwendung der Bootstrap-Registerkarte gelten, Ihr Code verwendet keine davon.

Versuchen Sie folgendes:

<ul class="nav nav-tabs forum_tabs"> 
    <li class="active"><a data-toggle="tab" href="#tab1">Tab1</a></li> 
    <li><a data-toggle="tab" href="#tab2">Tab2</a></li> 
</ul> 

<div class="tab-content"> 
    <div id="tab1" class="tab-pane tabspane active"> 
    content for tab1 
    </div> 
    <div id="tab2" class="tab-pane tabspane"> 
    content for tab2 
    </div> 
</div>