Bootstrap - Online Quiz


Advertisements

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 styles a table with borders surrounding every element and rounded corners around the entire table?

A - .table

B - .table-striped

C - .table-bordered

D - .table-hover

Answer : C

Explanation

By adding the .table-bordered class, you will get borders surrounding every element and rounded corners around the entire table.

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 can be applied to button group instead of resizing each button?

A - .btn-group

B - .btn-toolbar

C - .btn-group-lg

D - .btn-group-vertical

Answer : C

Explanation

.btn-group-lg − This class can be applied to button group instead of resizing each button.

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 to be used if you want to create an inverted .navbar with a black background and with white text?

A - .navbar-reverse

B - .navbar-inverse

C - .navbar-inverted

D - None of the above.

Answer : B

Explanation

To create an inverted .navbar with a black background and with white text, simply add the .navbar-inverse class to the ..navbar class.

Answer : C

Explanation

To create a striped progress bar: Add a <div> with a class of .progress and .progress-striped. Next, inside the above <div>, add an empty <div> with a class of .progress-bar and class progress-bar-* where * could be success, info, warning, danger.

Answer : C

Explanation

Both of the above options are correct.

Answer : C

Explanation

data-placement − Specifies how to position the tooltip (i.e., top|bottom|left|right|auto).

Answer : B

Explanation

data-trigger − Defines how the tooltip is triggered: click| hover | focus | manual. You may pass multiple triggers; separate them with a space.

bootstrap_questions_answers.htm
Advertisements