Bootstrap Interview Questions & Answers

  • Home
  • Interview_Question

Interview Questions & Answers



Select Series



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.

What does Bootstrap package includes?

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 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 are Bootstrap media queries?

Media Queries in Bootstrap allow you to move, show and hide content based on viewport size.

Explain the typography and links in Bootstrap.

Bootstrap sets a basic global display (background), typography, and link styles − Basic Global display − Sets background-color: #fff; on the element. Typography − Uses the @font-family-base, @font-size-base, and @line-height-base attributes as the typographic base Link styles − Sets the global link color via attribute @link-color and apply link underlines only on :hover.

What is Lead Body Copy

To add some emphasis to a paragraph, add class = "lead". This will give you larger font size, lighter weight, and a taller line height

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.

How do you use Glyphicons?

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.

What is a transition plugin?

The transition plugin provides simple transition effects such as Sliding or fading in modals.

What is a Modal Plugin?

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.

What is Bootstrap caraousel?

The Bootstrap carousel is a flexible, responsive way to add a slider to your site. In addition to being responsive, the content is flexible enough to allow images, iframes, videos, or just about any type of content that you might want.

What is button group

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.

Which classes can be applied to button group instead of resizing each button

.btn-group-lg, .btn-group-sm, .btn-group-xs classes can be applied to button group instead of resizing each button.

Which class make a set of buttons appear vertically stacked rather than horizontally

.btn-group-vertical class make a set of buttons appear vertically stacked rather than horizontally.

How will you create a pills navigation menu

To create a pills navigation menu − Start with a basic unordered list with the base class of .nav. Add class .nav-pills.

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.

What is bootstrap navbar

The navbar is one of the prominent features of Bootstrap sites. Navbars are responsive 'meta' components that serve as navigation headers for your application or site. Navbars collapse in mobile views and become horizontal as the available viewport width increases. At its core, the navbar includes styling for site names and basic navigation.

What is 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).

Which class is used for basic pagination

.pagination class is uesed to add the pagination on a page.

How will you customize links of pagination

You can customize links by using .disabled for unclickable links and .active to indicate the current page.

What are bootstrap badges

Badges are similar to labels; the primary difference is that the corners are more rounded. Badges are mainly used to highlight new or unread items. To use badges just add to links, Bootstrap navs, and more.