Bootstrap Interview Questions

Checkout Vskills Interview questions with answers in Bootstrap to prepare for your next job role. The questions are submitted by professionals to help you to prepare for the Interview.

Q.1 What do you understand by Bootstrap?
Bootstrap is a front-end framework to create responsive designs using HTML, and CSS These templates are used for forms, tables, buttons, typography, models, tables, navigation, carousels and images Bootstrap also has JavaScript plugins, which are optional
Q.2 Why Bootstrap is preferred for website development?
Bootstrap has better features, provides extensive browser support for most web browsers and also supports mobile applications by responsive design to adjust CSS as per the device, screen size, etc Instead of creating multiple files, it creates only a single file reducing the work of a developer
Q.3 List the main components of Bootstrap
The key components of Bootstrap are CSS, Scaffolding (gives a basic structure with the Grid system, link styles, and background), Layout Components (gives the list of layout component), JavaScript Plugins (has many jQuery and JavaScript plugins) and customize (to get your own version of the framework)
Q.4 What are important characteristics of Bootstrap
Some important features of Bootstrap are: open-source for use, compatibility with all browsers, has Responsive designs and easy to use and fast
Q.5 Which class in Bootstrap styles a table as a nice basic table with just some light padding and horizontal dividers ?
The table class
Q.6 Which class in Bootstrap styles a table as a nice basic table with stripes on rows?
The table-striped class
Q.7 List the class in Bootstrap styles a table with borders surrounding every element and rounded corners around the entire table?
The table-bordered class
Q.8 Which class in Bootstrap styles a table with a light gray background to rows while the cursor hovers over them?
The table-hover class
Q.9 Which of the following class in Bootstrap applies the hover color to a particular row or cell of a table?
The active class
Q.10 Which class in Bootstrap indicates a successful or positive action?
The success class
Q.11 Select the class in Bootstrap which indicates a warning that might need attention?
The warning class
Q.12 Which of the following class indicates a dangerous or potentially negative action?
The danger class
Q.13 What is a Class loader in Bootstrap?
A class loader is a part of JRE or Java Runtime Environment which loads Java classes into Java virtual environment Class loaders also perform the process of converting a named class into its equivalent binary form
Q.14 How many types of layout are provided in Bootstrap?
There are two major layouts for Bootstrap: Fluid Layout (for creating an app that is 100 % wider and covers all the screen width ) and Fixed Layout (for a standard screen (940px) Both layouts can be used for creating a responsive design
Q.15 What do you understand by 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
Q.16 List the codes used for code display in Bootstrap?
To display code in Bootstrap, either use code tag (to display an inline code ) or pre tag( for code with several lines)
Q.17 What is a Bootstrap Container, and how does it work?
A bootstrap container is a class which generates a central region on the page to place our site content The bootstrap container has the advantage of being responsive and containing all of our other HTML code Containers are used to pad the content within them
Q.18 What are different types of Bootstrap Container?
There are types of Bootstrap containers - The container class which creates a fixed-width container that is responsive and the container-fluid class which creates a full-width container that spans the entire viewport width
Q.19 How is typography used in Bootstrap?
The typography in Bootstrap uses the @font-family-base, @font-size-base, and @line-height-base attributes as the typographic base
Q.20 How to set background in Bootstrap?
The basic global display in Bootstrap sets background-color:#fff; on the element
Q.21 What are the link styles in Bootstrap?
Link styles sets the global link color via attribute @link-color and applies link underlines only on :hover
Q.22 List the default Bootstrap text settings
The default font size in Bootstrap 4 is 16px, with a line-height of 1 5 The default font family is "Helvetica Neue," which includes Helvetica, Arial, and other sans-serif fonts Margin-top: 0 and margin-bottom: 1rem are also set on all p elements (16px by default)
Q.23 What makes images responsive in Bootstrap?
Bootstrap makes 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
Q.24 What is media object in Bootstrap?
Media objects in Bootstrap enables embedding media object like image, video or audio to along the content blocks
Q.25 What are media object types in Bootstrap?
The two types of media objects in Bootstrap are: media and media-list
Q.26 What are the classes in the Bootstrap grid system?
There are 5 classes in the Bootstrap grid system which are: col(for extra small devices, whose screen width is less than 576px ), col-sm (small devices, whose screen width is equal to or greater than 576px ), col-md (medium devices, whose screen width is equal to or greater than 768px), col-lg (large devices, whose screen width is equal to or greater than 992px) and col-xl (extra large devices, whose screen width is equal to or greater than 1200px )
Q.27 What is the use of carousel plugin in Bootstrap?
The carousel plugin in bootstrap is used to make sliders in the web page There are several carousel plugins that are used in bootstrap to display large contents within a small space by adding sliders
Q.28 How Bootstrap style navigation elements?
Bootstrap offers various options for styling navigation elements All of these use the same markup and base class nav
Q.29 List the contextual classes in Bootstrap to style the panels
In Bootstrap, the contextual state classes like panel-primary, panel-success, panel-info, panel-warning, and panel-danger are used to make a panel more meaningful to a specific context
Q.30 How will you create an alert in Bootstrap?
In Bootstrap, create a wrapper div and add a class of alert and one of the contextual classes to create a basic alert (e g , alert-success, alert-info, alert-warning, alert-danger, alert-primary, alert-secondary, alert-light or alert-dark)
Get Govt. Certified Take Test