Bootstrap - Online Quiz



Following quiz provides Multiple Choice Questions (MCQs) related to Bootstrap Framework. You will have to read all the given answers and click over the correct answer. If you are not sure about the answer then you can check the answer using Show Answer button. You can use Next Quiz button to check new set of questions in the quiz.

Questions and Answers

Q 2 - Which of the following class can be used to create a responsive table?

A - .table-responsive

B - .responsive

C - .active

D - .table

Answer : A

Explanation

By wrapping any .table in .table-responsive class, you will make the table scroll horizontally up to small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.

Q 3 - Which of the following bootstrap style of button indicates a dangerous or potentially negative action?

A - .btn-warning

B - .btn-danger

C - .btn-link

D - .btn-info

Answer : B

Explanation

.btn-danger − Indicates a dangerous or potentially negative action.

Q 4 - Which of the following bootstrap style of image adds a bit of padding and a gray border?

A - .img-rounded

B - .img-circle

C - .img-thumbnail

D - None of the above.

Answer : C

Explanation

.img-thumbnail − adds a bit of padding and a gray border.

Q 5 - Which of the following bootstrap style is used to add text to .navbar?

A - .navbar-text

B - .text

C - .form-text

D - None of the above.

Answer : A

Explanation

To wrap strings of text in an element use the class .navbar-text. This is usually used with <p> tag for proper leading and color.

Q 6 - Which of the following bootstrap style is used to create a .breadcrumb?

A - .breadcrumb

B - .navbar

C - .menu

D - None of the above.

Answer : A

Explanation

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

Q 7 - Which of the following bootstrap styles can be used to create a default progress bar?

A - .progress, .progress-bar

B - .nav-progress

C - .link-progress-bar

D - None of the above.

Answer : A

Explanation

To create a basic progress bar: Add a <div> with a class of .progress. Next, inside the above <div>, add an empty <div> with a class of .progress-bar.

Answer : C

Explanation

Both of the above options are correct.

Answer : D

Explanation

data-remote − Using the jQuery .load method, injects content into the modal body. If an href with a valid URL is added, it will load that content.

Answer : D

Explanation

data-delay − Delays showing and hiding the tooltip in ms , does not apply to manual trigger type. If a number is supplied, delay is applied to both hide/show.

bootstrap_questions_answers.htm
Advertisements