Navigation elements

Bootstrap supports multiple types of navigation element and can be used as described in the following code:

Tabs

The tab class creates small tabs on the navigation bar, and each tab provides a link to different pages:

<ul class="nav nav-tabs"> … </ul>

The tabs basically are links to other pages or websites; thus, the tab class should be declared within the link tags, as shown in the preceding code.

Pills

The pill class has the same functionality as the tab class, with the only difference being the styling. The tabs now appear like pills:

<ul class="nav nav-pills"> … </ul>

Justified

Adding an additional class of nav-justified would allow tabs or pills to automatically adjust themselves according to the screen resolution. The tabs or pills are given equal widths:

<ul class="nav nav-tabs nav-justified"> … </ul>

Disabled links

Adding a disabled class to a tab or pill in a navigation bar would remove the hover state, disabling the access to the link:

<ul class="nav nav-pills">
  ...
   <li class="disabled"><a href="#">Disabled link</a></li>
  ...
</ul>

Note

Remember to place the actual link in place of #.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.14.141.115