Essential Bootstrap Interview Preparation Guide
Download PDF

Bootstrap based Frequently Asked Questions by expert members with experience as Bootstrap. These questions and answers will help you strengthen your technical skills, prepare for the new job test and quickly revise the concepts

128 Bootstrap Questions and Answers:

Table of Contents:

Essential  Bootstrap Job Interview Questions and Answers
Essential Bootstrap Job Interview Questions and Answers

1 :: Do you know what is Bootstrap well?

Bootstrap well is a container <div> that makes the content to appear sunken or an inset effect on the page. In order to create a well, wrap the content that you would like to appear in the well with a <div> containing the class of .well.

2 :: Tell me 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.

3 :: What is button group in Bootstrap?

Button groups allow multiple buttons to be stacked together on a single line. This is useful when you want to place items like alignment buttons together.

4 :: What is Bootstrap Container in Bootstrap?

Bootstrap container is a class which is useful and creating a centred area in the page for display.

5 :: Tell me what is Bootstrap collapsing elements?

Bootstrap collapsing elements enables you to collapse any particular element without writing any JavaScript code or the accordion markup. In Bootstrap to apply collapsing elements you have to add data-toggle= “collapse” to the controller element along with a data-target or href to automatically assign control of a collapsible element. Likewise, you can use .collapse (options), .collapse (‘show’) or .collapse (‘hide’)

6 :: What is Fluid Layout in Bootstrap?

Fluid layout adapts itself to different browser. Means design automatic adjust according to browser size.

7 :: What is Bootstrap collapsing elements?

Bootstrap collapsing elements enables you to collapse any element without using external JavaScript.

8 :: Do you know what is Bootstrap Jumbotron?

As the name suggest this component can optionally increase the size of headings and add a lot of margin for landing page content. To use the Jumbotron −

☛ Create a container <div> with the class of .jumbotron.
☛ In addition to a larger <h1>, the font-weight is reduced to 200px.

9 :: How to add badge to list group in Bootstrap?

<span class="badge"></span> in LI Tag

10 :: Tell me what is the purpose of .media class in bootstrap?

This class allows to float a media object (images, video, and audio) to the left or right of a content block.

11 :: How to make images responsive in Bootstrap?

Bootstrap 3 allows to make the images responsive by adding a class .img-responsive to the <img> tag. This class applies max-width: 100%; and height: auto; to the image so that it scales nicely to the parent element.

12 :: Do you know what are bootstrap labels?

Bootstrap labels are great for offering counts, tips, or other markup for pages. Use class .label to display labels.

13 :: Do you know what are bootstrap panels?

Panel components are used when you want to put your DOM component in a box. To get a basic panel, just add class .panel to the <div> element. Also add class .panel-default to this element.

14 :: What are current Stable version of Bootstrap?

Version: 3.3.7, Dated: July 25, 2016

15 :: What is responsive layout?

Responsive layout which is able to adapt itself to different sizes as well, but when resizing, the number of columns changes according to the available space.

16 :: How do you use Glyphicons in Bootstrap?

To use the icons, simply use the following code just about anywhere in your code. Leave a space between the icon and text for proper padding.

<span class = "glyphicon glyphicon-search"></span>

17 :: Tell me what is the use of Jumbotron in Bootstrap?

In bootstrap, Jumbotron is generally used for content that you want to highlight like some slogan or marketing headline etc. in other words it is used to enlarge the size of the headings and to add a margin for landing page content

To use the Jumbotron in Bootstrap

Create a container <div> with the class of .jumbotron

18 :: How to order columns in Bootstrap?

You can easily change the order of built-in grid columns with .col-md-push-* and .col-md-pull-* modifier classes where * range from 1 to 11.

19 :: Tell me how will you create a vertical pills navigation menu?

You can stack the pills vertically using the class .nav-stacked along with the classes: .nav, .nav-pills.

20 :: Is Bootstrap Browser compatibility?

Bootstrap is compatible with all modern browsers like Google Chrome, Mozilla Firefox, Internet Explorer, Safari, and Opera.

22 :: Do you know what is Scrollspy plugin?

The Scrollspy (auto updating nav) plugin allows you to target sections of the page based on the scroll position. In its basic implementation, as you scroll, you can add .active classes to the navbar based on the scroll position.

23 :: What is a Modal Plugin in Bootstrap?

A modal is a child window that is layered over its parent window. Typically, the purpose is to display content from a separate source that can have some interaction without leaving the parent window. Child windows can provide information, interaction, or more.

24 :: Do you know 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.

25 :: Tell me how will you create a tabbed navigation menu?

To create a tabbed navigation menu −

Start with a basic unordered list with the base class of .nav.
Add class .nav-tabs.
Bootstrap Interview Questions and Answers
128 Bootstrap Interview Questions and Answers