JS标签页

  • 标签页

  1. 基本实例
    <div>
    
      <!-- Nav tabs -->
      <ul class="nav nav-tabs">
        <li class="active"><a href="#home"data-toggle="tab">Home</a></li>
        <li><a href="#profile" data-toggle="tab">Profile</a></li>
        <li><a href="#messages" data-toggle="tab">Messages</a></li>
        <li><a href="#settings" data-toggle="tab">Settings</a></li>
      </ul>
    
      <!-- Tab panes -->
      <div class="tab-content">
        <div class="tab-pane active" id="home">...</div>
        <div class="tab-pane" id="profile">...</div>
        <div class="tab-pane" id="messages">...</div>
        <div class="tab-pane" id="settings">...</div>
      </div>
    
    </div>

    截图:
    JS标签页

    点击不同的标签显示不同的内容

  2. 淡入淡出:
    <div class="tab-content">
      <div class="tab-pane fade in active" id="home">...</div>
      <div class="tab-pane fade" id="profile">...</div>
      <div class="tab-pane fade" id="messages">...</div>
      <div class="tab-pane fade" id="settings">...</div>
    </div>

     

     

上一篇:取代 Python 多进程!伯克利开源分布式框架 Ray


下一篇:HDU 3839 Ancient Messages(DFS)