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.

Q 1 - Which of the following is correct about Bootstrap cross browser consistency?

A - Bootstrap uses Normalize to establish cross browser consistency.

B - Normalize.css is a modern, HTML5-ready alternative to CSS resets.

C - Normalize.css is a small CSS file that provides better cross-browser consistency in the default styling of HTML elements.

D - All of the above.

Answer : D

Explanation

All of the above options are correct.

Q 2 - Which of the following class styles a table as a nice basic table with just some light padding and horizontal dividers?

Answer : A

Explanation

If you want a nice, basic table style with just some light padding and horizontal dividers, add the base class of .table to any table.

Q 3 - Which of the following bootstrap style of button creates a default/ standard button?

Answer : A

Explanation

.btn − Default/ Standard button.

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 add standard links to .navbar?

A - .navbar-link

B - .link

C - .form-link

D - None of the above.

Answer : A

Explanation

If you want to use the standard links that are not within the regular .navbar navigation component, then use the class .navbar-link to add proper colors for the default and inverse .navbar options.

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

A - .progress-active

B - .active

C - .progress-striped.

D - None of the above.

Answer : B

Explanation

To create an animated progress bar: Add a <div> with a class of .progress and .progress-striped. Also add class .active to .progress-striped. Next, inside the above <div>, add an empty <div> with a class of .progress-bar.

Q 8 - Which of the following is correct about Modal Plugin?

A - You can toggle the modal plugin's hidden content via data attributes.

B - You can toggle the modal plugin's hidden content via javascript.

C - Both of the above.

D - None of the above.