Default Tab
Custom Tab
Centered Tabs and Pills
To center/justify the tabs and pills, use the
.nav-justified class.
Home
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iste nobis, fugit pariatur minima! Dolorum modi pariatur aperiam quas odio nulla, illo necessitatibus dolor a.
Profile
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iste nobis, fugit pariatur minima! Dolorum modi pariatur aperiam quas odio nulla, illo necessitatibus dolor a.
Cotanct
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iste nobis, fugit pariatur minima! Dolorum modi pariatur aperiam quas odio nulla, illo necessitatibus dolor a.
Toggleable / Dynamic Tabs
To make the tabs toggleable, add the
data-toggle="tab" attribute to each link. Then add a
.tab-pane class with a unique ID for every tab and wrap them inside a
<div> element with class .tab-content. If you want
the tabs to fade in and out when clicking on them, add the .fade class
to .tab-pane:
Home
Some content here.
Menu 1
Some content here.
Menu 2
Some content here.