Most Asked Bootstrap Multiple Choice Questions

1) Who developed the bootstrap?

James Gosling

Mark Jukervich

Dennis Ritchie

Mark Otto and Jacob Thornton

Answer: (d) Mark Otto and Jacob Thornton

Explanation: Mark Otto and Jacob Thornton developed bootstrap at Twitter. It was released as an open-source product in August 2011 on GitHub.

2) Is Bootstrap3 mobile-first?

True

False

Can't say

May be

Answer: (a) True

Explanation: Bootstrap 3 is the most stable version of Bootstrap, and it is still supported by the team for critical bugfixes and documentation changes. Bootstrap is more than efficient to create a responsive and mobile-first website.

3) Which of the following class in Bootstrap is used to provide a responsive fixed width container?

.container-fixed

.container-fluid

.container

All of the above

Answer: (c) .container

Explanation: In Bootstrap, a container is used to set the content's margins dealing with the responsive behaviors of your layout. The .container class is used to create boxed content.

4) How many columns are allowed in a bootstrap grid system?

Answer: (b) 12

Explanation: The Bootstrap Grid System allows up to 12 columns across the page. You can use all 12 columns individually, or you can groups the columns together to create wider columns.

5) Which of the following class in bootstrap is used to create a big box for calling extra attention?

.box

.container

.container-fluid

.jumbotron

Answer: (d) .jumbotron

Explanation: A Bootstrap jumbotron specifies a big box for getting extra attention to some special content or information. It is displayed as a grey box with rounded corners. It can also enlarge the font sizes of the text inside it. The class .jumbotron within the <div> element is used to create a jumbotron.

6) The correct syntax of creating a standard navigation bar is -

Answer: (b) <nav class="navbar navbar-default">

Explanation: A navigation bar is like a navigation header that is placed at the top of the page. You can collapse or extend it according to the screen size. You can create a standard navigation bar at the top of the page with <nav class="navbar navbar-default">.

7) Which of the following is the correct syntax of creating a standard navigation tab?

Answer: (c) <ul class="nav nav-tabs">

Explanation: We can create a basic navigation tab with <ul class="nav nav-tabs">.

8) Which of the following class is used to create a black navigation bar?

.navbar-default

.navbar-inverse

.navbar-black

.navbar-dark

Answer: (b).navbar-inverse

Explanation: Inverted navigation bar provides an alternative black navbar. It can be used to style the default navigation bar by changing .navbar-default class into .navbar-inverse class.

9) The plugin used to create a cycle through elements as a slideshow is -

slideshow

scrollspy

carousel

None of the above

Answer: (c) carousel

Explanation: The Bootstrap carousel is a flexible, responsive way that is used to add a slider to your webpage. The carousel plugin is a component for cycling through an element, like a slideshow. If you want to add plugin functionality individually, then you have to use carousel.js file or all at once (using "bootstrap.js" or "bootstrap.min.js").

10) Which of the following class in Bootstrap is used to create a dropdown menu?

.dropdown

.select

.select-list

None of the above

Answer: (a) .dropdown

Explanation: Dropdown menus are toggleable, contextual menus, used for displaying links in a list format. It facilitates users to choose one value from a predefined list. We have to wrap dropdown menu within the class .dropdown to create Bootstrap Dropdown.

11) Which of the following class in Bootstrap is used to create a basic list group?

.grouped-list

.select-list

.list-group

.list-grouped

Answer: (c) .list-group

Explanation: The class ".list-group" within the <ul> element and the class ".list-group-item" within the <li>element are used to create a basic list group. Bootstrap list group is used to create a group of list with list items.

12) The class used to shape an image to a circle is -

.img-rounded

.img-circle

.img-rounded

None of the above

Answer: (b) .img-circle

Explanation: The class .img-circle is used to shape the image into a circle (IE8 does not support rounded corners).

13) Which of the following class in Bootstrap is used to add a zebra-stripe to a table?

.tab-striped

.zebra-strip

.table-stripped

.table-striped

Answer: (d) .table-striped

Explanation: We can create different types of Bootstrap tables by using different classes to style them. The .table-striped class is used to add zebra-stripes to a table.

14) Which of the following class in Bootstrap is used to create a large button?

.btn-xl

.btn-lrg

.btn-large

.btn-lg

Answer: (d).btn-lg

Explanation: We can use the .btn-lg class in bootstrap to create a large button.

15) Which of the following plugin in Bootstrap is used to create a modal window?

popup

alert

modal

window

Answer: (c) modal

Explanation: The bootstrap modal plugin is a dialog box/popup window that is displayed on top of the current page.

16) Which of the following class in Bootstrap is used to create basic pagination?

.page

.pagin

.paginate

.pagination

Answer: (d) .pagination

Explanation: Pagination is used to sort the web pages of your website in an organized manner. It becomes very necessary if your website has a lot of web pages. We can add the .pagination class to get the pagination on our page.

17) Which of the following class in Bootstrap is used to create a badge?

.tag

.badge

.page

.flag

Answer: (b) .badge

Explanation: Bootstrap Badges are numerical indicators used to show that how many items are associated with the specific link. Badges are used to highlight new or unread items. The class .badge within the element is used to create badges.

18) The class in Bootstrap used to provide rounded corners to the image is -

.img-circle

.image-circle

.image-rounded

.img-rounded

Answer: (d) .img-rounded

Explanation: The class .img-rounded is used to add rounded corners to an image (IE8 does not support rounded corners). It adds border-radius: 6px to give the image rounded corners.

19) Which of the following class in Bootstrap is used to create a panel?

.panel

.container

.box

.jumbotron

Answer: (a) .panel

Explanation: In Bootstrap, a panel is a bordered box with some padding around its element. The class .panel is used within the <div> element to create Bootstrap panels.

20) Using which of the following, we can create a pager in Bootstrap?

.carousel

.collapse

.pager

None of the above

Answer: (c) .pager

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

21) The class in Bootstrap which is used to specify the collapsible elements is -

.collapse

.carousel

.pager

None of the above

Answer: (a) .collpase

Explanation: Bootstrap collapse is used when you want to hide and show a large amount of content. The ".collapse" class is used to specify the collapsible element.

22) Which of the following class in Bootstrap is used to create a well?

.wel

.well

.well-container

.container-well

Answer: (b) .well

Explanation: In Bootstrap, wells are used to add a rounded border around an element with a gray background color and some padding. It is like a container that displays the content. The class .well is used with <div> element to add well.

23) The class used for creating the large size wells is -

.well-large

.well-big

.well-lg

.well-sm

Answer: (c) .well-lg

Explanation: By default, the size of the wells is medium, but you can change the size of the well according to your need. The ".well-lg" class is used for large wells.

24) The class used for creating the small size wells is -

.well-small

.well-short

.well-lg

.well-sm

Answer: (d) .well-sm

Explanation: By Default, wells size is medium, but you can change the size of the well according to your need. The .well-sm class is used for small wells.

25) Which of the following class in Bootstrap is used for creating the large size modals?

.modal-large

.modal-sm

.modal-big

.modal-lg

Answer: (d) .modal-lg

Explanation: We can use the .modal-lg class for large modals. The size class is added to the <div> element with class .modal-dialog.

26) Which of the following class in Bootstrap is used for creating the small size modals?

.modal-large

.modal-sm

.modal-big

.modal-lg

Answer: (b) .modal-sm

Explanation: We can use the .modal-sm class for creating the small modals. The size class is added to the <div> element with class .modal-dialog.

27) Which of the following class in Bootstrap is used to indicate the uppercased text?

.text-capitalize

.text-upper

.uppercase

.text-uppercase

Answer: (d) .text-uppercase

Explanation: We can use the ".text-uppercase" class to make the text appear in uppercase.

28) Which of the following plugin is used to create a tooltip?

popover

tooltip

modal

None of the above

Answer: (b) tooltip

Explanation: Tooltips are a great way to display extra information about something when the user moves the mouse cursor over an element.

29) Which of the following is the correct syntax to insert search icon?

Answer: (c) <span class = "glyphicon glyphicon-search"> </span>

Explanation: Glyphicons are the icon fonts that are used in web projects. Bootstrap provides 260 Glyphicons from the Glyphicons Halflings set. The correct syntax of inserting the search icon using Bootstrap is: <span class = "glyphicon glyphicon-search"> </span>

30) Which of the following class is used to add a heading to the panel?

.panel-head

.panel-header

.panel-heading

.panel-content

Answer: (c) .panel-heading

Explanation: In Bootstrap, a panel is a bordered box with some padding around its element. The .panel-heading class is used to add a heading to the panel.

31) Which of the following is correct method to add a success button?

<button class = "btn btn-success"> success </button>

<button class = "btn button-success"> success </button>

<button class = "button btn-success"> success </button>

<button class = "button btn-primary"> success </button>

Answer: (a) <button class = "btn btn-success"> success </button>

Explanation: There are various styles to add a button in Bootstrap. The syntax for creating a success button in Bootstrap is: <button class = "btn btn-success"> success </button>.

32) Which of the following class in Bootstrap is used to create a label?

.label

.badge

.flag

.popover

Answer: (a) .label

Explanation: Bootstrap labels are used to specify the additional information about something like offering counts, tips, or other makeup for pages. The class .label is used to display the labels.

33) Is it true that the Bootstrap grid system works across multiple devices?

True

False

Can't say

May be

Answer: (a) True

Explanation: Bootstrap Grid System is responsive, and the columns are re-arranged automatically according to the screen size. The Bootstrap Grid System allows up to 12 columns across the page. You can use all 12 columns individually, or you can groups the columns together to create wider columns.

34) Glyphicons in Bootstrap are used for -

Using different icons on a webpage such as print, envelope, etc.

Removing different icons on the page

Selecting different icons on the page

None of the above

Answer: (a) Using different icons on a webpage such as print, envelope, etc.

Explanation: None

35) What is the default layout of the Bootstrap form?

Horizontal

Inline

Vertical

None of the above

Answer: (c) Vertical

Explanation: In Bootstrap, there are three types of form layouts that are - vertical, horizontal, and inline. The default layout of the Bootstrap form is vertical.

36) Which of the following class indicates the capitalized text?

.text-capitalize

.text-upper

.uppercase

.text-uppercase

Answer: (a) .text-capitalize

Explanation: We can use the ".text-capitalize" class to make the text appear in uppercase.

37) The class used to right align the navigation bar buttons is -

.navbar-rgt

.navbar-btn

.navbar-right

.navbar-default

Answer: (c) .navbar-right

Explanation: The .navbar-right class is used to right-align the navigation bar buttons.

38) Which of the following class is used to create a thumbnail image?

.img-circle

.img-nail

.img-thumb

.img-thumbnail

Answer: (d) .img-thumbnail

Explanation: The class .img-thumbnail is used to shape an image into a thumbnail. It adds a bit of padding and a gray border.

39) Which of the following class in Bootstrap is used to create a button as a link?

.btn-anchor

.btn-link

.btn-hyperlink

None of the above

Answer: (b) .btn-link

Explanation: There are various styles of the button are available in Bootstrap. By using the .btn-link class, we can create a button as a link.

40) Which of the following grid class in Bootstrap is used for desktops?

Answer: (d) md

Explanation: Basically, there are four classes in Bootstrap grid system that is xs, sm, md, and lg. From these classes, we can use the md class for the devices like desktops.

41) The class "xs" in Bootstrap is used for -

tablets

phones

desktop

All of the above

Answer: (b) phones

Explanation: Basically, there are four classes in Bootstrap grid system that is xs, sm, md, and lg. The xs class is used for small devices such as phones.

42) Which of the following class in Bootstrap is used to create an animated progress bar?

.active

.progress-success

.progress-active

None of the above

Answer: (a) .active

Explanation: The progress bar shows how far a user is in a process. In Bootstrap, there are several types of progress bars. The class .active is used to create an animated progress bar.

43) Which of the following statement is correct about the Bootstrap wells?

By default, the size of wells is medium.

Using .well-sm and .well-lg classes, we can change the size of wells.

The .well-sm class is for small wells, and the .well-lg class is for large wells. And both classes should be used in conjunction with .well class.

All of the above

Answer: (d) All of the above

Explanation: The class .well is used with

element to add well. By Default, wells size is medium, but you can change the size of the well according to your need. The .well-sm class is used for small wells, and the .well-lg class is used for large wells.

44) Which of the following is correct about the Bootstrap Grid system?

The Bootstrap Grid system allows 12 columns across the page.

Bootstrap Grid system is responsive.

Both (a) and (b)

Neither (a) nor (b)

Answer: (c) Both (a) and (b)

Explanation: The Bootstrap Grid System allows up to 12 columns across the page. You can use all 12 columns individually, or you can groups the columns together to create wider columns. Bootstrap Grid System is responsive, and the columns are re-arranged automatically according to the screen size.

45) Which of the following statement is true about jumbotron in Bootstrap?

The .jumbotron class is used to create a jumbotron.

It is generally used for getting extra attention. It enlarges the font-size of the text inside it.

Both (a) and (b)

Neither (a) nor (b)

Answer: (c) Both (a) and (b)

46) Which of the following statement is true about responsive images in Bootstrap?

We can use the .img-responsive class to the <img> tag to create responsive images.

The responsive images adjust themselves automatically to fit according to the screen size.

Both (a) and (b)

Neither (a) nor (b)

Answer: (c) Both (a) and (b)

Explanation: The responsive images can adjust themselves automatically to fit the size of the screen. You can create responsive images by adding an .img-responsive class to the <img> tag. The image will then scale nicely to the parent element. The .img-responsive class applies display: block; and max-width: 100%; and height: auto; to the image.

47) Which of the following set of classes in the Bootstrap grid system used to define the screen size?

small, xs, lg, extra-large

xs, medium, lg, sm

sm, mg, lg

xs, sm, md, lg

Answer: (d) xs, sm, md, lg

Explanation: Basically, there are four classes in Bootstrap Grid System that are listed below:

xs (for phones)

sm (for tablets)

md (for desktops)

lg (for larger desktops)

We can combine the above classes to create more dynamic and flexible layouts.

48) Which of the following class in Bootstrap is used to style a table with borders surrounding every element?

.table-striped

.table-bordered

.table-border

.table-condensed

Answer: (b) .table-bordered

Explanation: The .table-bordered class is used to add borders on all sides of the table and cells.

49) Which of the following class in Bootstrap is used to style a table with a light gray background to rows when the user moves the cursor over them?

.table-striped

.table-bordered

.table-border

.table-hover

Answer: (d) .table-hover

Explanation: The .table-hover class is used to enable a hover state on table rows.

50) The scrollspy plugin in Bootstrap automatically updates the links in a navigation list based on scroll position -

True

False

Can't say

May be

Answer: (a) True

Explanation: The Bootstrap Scrollspy plugin is used to automatically update links in a navigation list based on scroll position.

Search This Blog

AtoZExams

Most Asked Bootstrap Multiple Choice Questions

Comments

Post a Comment

Popular posts from this blog

Mini-Max Algorithm in Artificial Intelligence

Alpha-Beta Pruning

SQL Multiple Choice Questions