Tab Control

The Bootstrap Tab Control provides a visual interface for creating custom tabbed layouts. The Tab Control provides only navigation means and requires manually updating specific content to reflect a selected tab's changes.


The Bootstrap Tab Control offers you an extremely flexible means to control end-user interaction. Numerous server-side settings, client-side API and events allow you to take full control over how your tab control responds to user actions. You have complete control over what user action activates a tab, and whether there should be a postback, callback or client processing. Note that the most frequently used scenarios are already built-in - you just need to toggle a property.

This topic lists the features that are unique to the web controls from the Bootstrap Tab Control.

Control Features

  • Templates can be specified for tabs in both active and inactive states, and for each tab individually.
  • The Tab Control supports two ways to activate a tab - by clicking it or by hovering over it with the mouse pointer.

Client-Side Features

  • Client-side events allow you to perform custom actions when an end-user clicks on a tab, and immediately after the corresponding page has been loaded. If you use AJAX functionality, you will need these events to indicate that a callback is in progress.
  • You can use the client-side API to activate tabs and obtain tab information.

Online Demo: The Client-Side Events and Client-Side Functionality online demos illustrate client-side API.

Tab Features

  • Customizable tab spacing.
  • Tab position and alignment can be changed to display tabs at any edge and corner of the Tab Control.
  • You can specify tooltips for tabs.
  • Tabs can display supplementary information within a badge.
See Also