Bootstrap 3 Navs
Add navigation tabs and pills easily with Bootstrap's .nav class.
Bootstrap's .nav class (and associated classes) lets you turn a list into tabs and navigation "pills".
To add a tab or nav pill, add the .nav class and either .nav-pills or .nav-tabs to a <ul> element containing the list of navigation items.
Tabs
Add class="nav nav-tabs" to the <ul> element containing the list of navigation items.
Also use class="active" to make a tab the selected tab.
Pills
Change nav-tabs to nav-pills to display pills instead.
Vertical Pills
You can stack pills vertically by adding .nav-stacked to the class list.
Justified Navs
You can justify tabs and pills by adding .nav-justified.
If the tabs are stacked on top of each other in this example, it is because the viewport is small. Try viewing the preview in a new window to see how it appears on a larger viewport. If they are still stacked, you may need to view this on a larger device.
Disabled Links
You can add Bootstrap's .disabled class to make a tab or pill appear to be disabled.
Note that this only makes the nav look disabled. It doesn't actually disabled any <a> functionality, so you will need to use other means to actually disable that element (such as JavaScript).
Tabs with Dropdown Menus
You can add a dropdown menu to a tab or pill. In this case, the .dropdown class is applied to a <li> element (not a <div> element).