Content of Tab 1
Content of Tab 2
Content of Tab 3
Content of Tab 4
Content of Tab 5
<h2>Tabs</h2>
<ul id="tab" class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#tab1">Tab 1</a></li>
<li><a data-toggle="tab" href="#tab2">Tab 2</a></li>
<li><a data-toggle="tab" href="#tab3">Tab 3</a></li>
<li><a data-toggle="tab" href="#tab4">Tab 4</a></li>
<li><a data-toggle="tab" href="#tab5">Tab 5</a></li>
</ul>
<div id="myTabContent" class="tab-content">
<div class="tab-pane fade active in" id="tab1">
<p>Content of Tab 1</p>
</div>
<div class="tab-pane fade" id="tab2">
<p>Content of Tab 2</p>
</div>
<div class="tab-pane fade" id="tab3">
<p>Content of Tab 3</p>
</div>
<div class="tab-pane fade" id="tab4">
<p>Content of Tab 4</p>
</div>
<div class="tab-pane fade" id="tab5">
<p>Content of Tab 5</p>
</div>
</div>
<div class="btn-group">
<button class="btn btn-large dropdown-toggle" data-toggle="dropdown">Groups <span class="caret"> </span></button>
<ul class="dropdown-menu">
<li><a href="#">Option 1</a></li>
<li><a href="#">Option 2</a></li>
<li><a href="#">Option 3</a></li>
<li class="divider"> </li>
<li><a href="#">Option 4</a></li>
</ul>
</div>
<a class="btn" data-toggle="modal" href="#myModal" >Launch Modal</a>
<div class="modal hide fade" id="myModal">
<div class="modal-header"><a class="close" data-dismiss="modal">×</a>
<h3>Member Login</h3>
</div>
<div class="modal-body">
<p> </p>
<form class="center" action="#" method="post" accept-charset="UNKNOWN">
<input type="text" name="login_userid" class="input-small" placeholder="User ID" />
<input type="password" name="login_password" class="input-small" placeholder="Password" />
<input type="submit" value="Login" name="1" class="formsubmit" id="1" />
</form>
<p class="center"><a target="_blank" href="#">Forgotten User ID?</a> | <a target="_blank" href="#">Lost password?</a></p>
</div>
<div class="modal-footer"><a class="formsubmit sml-button" href="/myclub">MyClub</a> <a class="formsubmit sml-button" href="/mycentre">MyCentre</a></div>
</div>
<p class="tooltip-demo"><a href="#" rel="tooltip" title="first tooltip">hover over me</a></p>
<a href="#" class="btn btn-danger" rel="popover" data-content="And here's some amazing content. It's very engaging. right?" data-original-title="A Title">hover for popover</a>
<div class="accordion" id="accordion2">
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
Collapsible Group Item #1
</a>
</div>
<div id="collapseOne" class="accordion-body collapse" style="height: 0px; ">
<div class="accordion-inner">
Content 1.
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
Collapsible Group Item #2
</a>
</div>
<div id="collapseTwo" class="accordion-body collapse" style="height: 0px; ">
<div class="accordion-inner">
Content 2.
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
Collapsible Group Item #3
</a>
</div>
<div id="collapseThree" class="accordion-body collapse">
<div class="accordion-inner">
Content Three.
</div>
</div>
</div>
</div>