Skip to main content
Shortened and clarified answer a bit
Source Link
Rahul
  • 23.9k
  • 10
  • 78
  • 168

Twitter's Bootstrap framework uses Tabs and Tab content.

Usually from an html/css/js coding point of view:

<ul class="tabs">
    <li class="active"><a href="#home">Home</a></li>
    <li><a href="#profile">Profile</a></li>
    <li><a href="#messages">Messages</a></li>
    <li><a href="#settings">Settings</a></li>...
</ul>
 
<div class="tab-content">
    <div class="active" id="home">...</div>
    <div id="profile">...</div>
    <div id="messages">...</div>
    <div id="settings">...</div>
</div>
 
<script>
$(function () {
    $('.tabs').tabs()
})
</script>

Taken from the Bootrstrap framework (although they call it pill-content because of some lazy copy-paste from the pills navigation). Something similar is used in the jQuery UI Tabs.

Tabs and Tab content.

Usually from an html/css/js coding point of view:

<ul class="tabs">
    <li class="active"><a href="#home">Home</a></li>
    <li><a href="#profile">Profile</a></li>
    <li><a href="#messages">Messages</a></li>
    <li><a href="#settings">Settings</a></li>
</ul>
 
<div class="tab-content">
    <div class="active" id="home">...</div>
    <div id="profile">...</div>
    <div id="messages">...</div>
    <div id="settings">...</div>
</div>
 
<script>
$(function () {
    $('.tabs').tabs()
})
</script>

Taken from the Bootrstrap framework (although they call it pill-content because of some lazy copy-paste from the pills navigation). Something similar is used in the jQuery UI Tabs.

Twitter's Bootstrap framework uses Tabs and Tab content:

<ul class="tabs">
  ...
</ul>
<div class="tab-content">
  ...
</div>

Something similar is used in the jQuery UI Tabs.

Source Link
Naoise Golden
  • 4.4k
  • 25
  • 28

Tabs and Tab content.

Usually from an html/css/js coding point of view:

<ul class="tabs">
    <li class="active"><a href="#home">Home</a></li>
    <li><a href="#profile">Profile</a></li>
    <li><a href="#messages">Messages</a></li>
    <li><a href="#settings">Settings</a></li>
</ul>
 
<div class="tab-content">
    <div class="active" id="home">...</div>
    <div id="profile">...</div>
    <div id="messages">...</div>
    <div id="settings">...</div>
</div>
 
<script>
$(function () {
    $('.tabs').tabs()
})
</script>

Taken from the Bootrstrap framework (although they call it pill-content because of some lazy copy-paste from the pills navigation). Something similar is used in the jQuery UI Tabs.