Hi！這是 頁籤 1 的頁面.
(1) <ul>....
</ul> 間是頁籤標頭區域。若要增加頁籤標題，則在區域內增加 <li>.....</li> 即可。
<div class="tab-content">.....</div> 間是頁籤頁面區域。(參考紅色字部份)
一個頁籤標題對應一個頁籤頁面。主要頁籤標題的 id 要指向對應的頁面 id。例：
頁籤標題：<a href="#panel-2" data-toggle="tab">，對應
頁籤頁面：<div class="tab-pane" id="panel-2">
(2) 一進頁面即要顯示的頁籤標頭，在其 <li> 內的 class 加入 active 即可。一進頁面即要顯示的頁籤頁單，則在頁面 <div> 內的 class 加入 active 即可 (參考藍色字部份)。不一定要設同對應的標題和頁面，您可以設頁籤1的標頭，但頁面設頁籤2的頁面。等您再去點選頁籤標題，就會回復對應的頁面了！^ ^
<!doctype html>
<html>
<head>
<meta charset="utf-8"> <title>喵喵笨兔 の 喵喵的家~遊戲天地 - JavaScript 帶入 POST 或 GET 語法 & 超連結</title> <link href="css/bootstrap.min.css" rel="stylesheet"> </head> <body> <div class="tabbable" id="tabs-1">
<ul class="nav nav-tabs">
<li class="active">
<a href="#panel-1" data-toggle="tab">頁籤 1</a>
</li>
<li>
<a href="#panel-2" data-toggle="tab">頁籤 2</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="panel-1">
<p>
Hi！這是 頁籤 1 的頁面.
</p>
</div>
<div class="tab-pane" id="panel-2">
<p>
<font color="green">嗨！這是 頁籤 2 的頁面.</font>
</p>
</div>
</div>
</div>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.min.js"></script> </body> </html>
嗨！這是 頁籤 2 的頁面.