Bootstrap Interview Questions and Answers

What is Twitter Bootstrap?

Bootstrap is a sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development. It uses HTML, CSS, and Javascript training Bangalore.

What Bootstrap Package Includes?

Scaffolding: Bootstrap provides a basic structure with Grid System, link styles, background. This is is covered in detail in the section Bootstrap Basic Structure

CSS: Bootstrap comes with the feature of global CSS settings, fundamental HTML elements styled and enhanced with extensible classes, and an advanced grid system. This is covered in detail in the section Bootstrap with CSS.

Components: Bootstrap contains over a dozen reusable components built to provide iconography, dropdowns, navigation, alerts, popovers, and much more. This is covered in detail in the section Layout Components.

JavaScript Plugins: Bootstrap contains over a dozen custom jQuery plugins. You can easily include them all, or one by one. This is covered in details in the section Bootstrap Plugins.

Customize: You can customize Bootstrap's components, LESS variables, and jQuery plugins to get your very own version.

What is Bootstrap Grid System?

Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts.

What are Glyphicons?

Glyphicons are icon fonts which you can use in your web projects. Glyphicons Halflings are not free and require licensing, however their creator has made them available for Bootstrap projects free of cost.

Define Bootstrap Breadcrumb?

Breadcrumbs are a great way to show hierarchy-based information for a site. In the case of blogs, breadcrumbs can show the dates of publishing, categories, or tags. They indicate the current page's location within a navigational hierarchy.

A breadcrumb in Bootstrap is simply an unordered list with a class of .breadcrumb. The separator is automatically added by CSS (bootstrap.min.css) through the following class:

.breadcrumb > li + li:before {

color: #CCCCCC;

content: "/ ";

padding: 0 5px;


Define  Bootstrap thumbnails?

A lot of sites need a way to lay out images, videos,text, etc in a grid, and Bootstrap has an easy way to do this with thumbnails.

To create thumbnails using Bootstrap:

What are Bootstrap Plugins?

Bootstrap comes bundled with 12 jQuery plugins that extend the features and can add more interaction to your site. To get started with Bootstrap’s JavaScript plugins, you don’t need to be an advanced JavaScript developer. By utilizing Bootstrap Data API, most of the plugins can be triggered without writing a single line of code.

Define UI Bootstrap?

UI Bootstrap incorporates Bootstrap components written in AngularJS by the AngularUI team. It aims to provide AngularJS directives with the markup and CSS of Bootstrap. It has dependencies on AngularJS and Bootstrap CSS.

Aspired to become an Bootstrap? 

Explore the post to discover the know-hows on Bootstrap Training.

Define Kickstrap?

Kickstrap is a product where AngularJS is baked together with Bootstrap in conjunction with JavaScript Package Manager (JSPM). You can leverage the advantage of running an authenticated database-driven web application without the native backend. Kickstrap uses Firebase adhering to a Backend as a Service (BaaS) model.

What are different button styles in Bootstrap?

There are seven styles to add a button in Bootstrap. Use the following classes to achieve the different button styles:

  • .btn-default
  • .btn-primary
  • .btn-success
  • .btn-info
  • .btn-warning
  • .btn-danger
  • .btn-link

What are Bootstrap Form Rules?

  • Always use <form role="form"> (helps improve accessibility for people using screen readers)
  • Wrap labels and form controls in <div class="form-group"> (needed for optimum spacing)
  • Add class .form-control to all textual <input>, <textarea>, and <select> elements

What are Bootstrap Alerts ?

Bootstrap Alerts are used to provide an easy way to create predefined alert messages. Alert adds a style to your messages to make it more appealing to the users.

There are four classes that are used within <div> element for alerts.

  • .alert-success
  • .alert-info
  • .alert-warning
  • .alert-danger

What is Bootstrap pager ?

The bootstrap pager is a form of pagination. It is used to create previous and next buttons (links).The ".pager" class is used within the <ul> element to create the previous / next buttons.

What is the role of pagination in bootstrap and what are their classifications?

When an unordered list has to be handled by bootstrap, it uses pagination. To handle the list,                      different classes are available such as ‘.pagination’, ‘.disabled’, ‘.active’, ‘.pagination-lg’. The function         ‘.pagination’ to paginate the webpage. The function ‘.disabled’ is used to make the links unclickable.          The function ‘.active’ is used for indicating the current webpage. The function ‘.pagination-lg’ and              ‘.pagination-sm’ can be used for getting different size items.

What is the procedure to create Nav elements in Bootstrap?

There are several styling navigation elements available on bootstrap and every style uses the same             function i.e. ‘class .nav’. In order to create tabs or a tabular navigation, you can begin with a simple          or rather basic unordered list using the function class .nav. To add the tabs the function ‘class .nav-             tabs can be used.