Bootstrap中Tab页签使用方法

<ul class="nav nav-tabs">
    <li role="presentation" class="active"><a href="#home" data-toggle="tab">Home</a></li>
    <li role="presentation"><a href="#detail1" data-toggle="tab">Detail1</a></li>
     <li role="presentation"><a href="detail2" data-toggle="tab">Detail2</a></li> 
</ul>

<div class="tab-content">
     <div class = "tab-pane fade in  active" id="home">
          <h1>this is Home!</h1>
     </div>
     <div  class = "tab-pane fade" id = "detail1">
          <h1>detail1</h1>
          <h2>Test Test</h2>
     </div>
     <div class = "tab-pane fade" id = "detail2">
           <h1>detail2</h1>
           <h2>Test Test1</h2>
           <h2>Test Test2</h2>
     </div> 
</div>