Bootstrap Quiz Test Online (30 random Questions) 2026

Test your Bootstrap knowledge with this 30-minute quiz! Covering fundamental to advanced concepts, this quiz features 30 multiple-choice questions that will challenge your understanding of the Bootstrap framework, including grid systems, components, utilities, and responsive design. Perfect for interview preparation and skill enhancement.

0 votes, 0 avg

You have 30 minutes to complete the quiz. The timer will start when you click the 'Start Quiz' button. Please ensure you are ready before beginning.

Time is up! Your quiz has ended. Your responses have been submitted automatically.

30 Minutes Bootstrap Quiz Test Online

Test your Bootstrap knowledge with this 30-minute quiz! Covering fundamental to advanced concepts, this quiz features 30 multiple-choice questions that will challenge your understanding of the Bootstrap framework, including grid systems, components, utilities, and responsive design. Perfect for interview preparation and skill enhancement.

1 / 30

1. What is the purpose of .text-break in Bootstrap?

A) Justifies text

B) Removes line breaks

C) Adds a break between lines

D) Forces text to wrap

2 / 30

2. How do you make text uppercase in Bootstrap?

A) .text-upper

B) .text-uppercase

C) .uppercase-text

D) .text-uppercase-all

3 / 30

3. What class do you use to add a shadow to an image?

A) .shadow-img

B) .img-shadow

C) .box-shadow

D) .shadow

4 / 30

4. What Bootstrap class adds a checkbox to a form?

A) .form-check-input

B) .checkbox-group

C) .checkbox

D) .form-checkbox

5 / 30

5. Which Bootstrap component automatically dismisses content when clicked outside?

A) Button

B) Tooltip

C) Alert

D) Modal

6 / 30

6. What Bootstrap class makes an image responsive?

A) .img-auto

B) .img-responsive

C) .img-fluid

D) .responsive-img

7 / 30

7. What is the Bootstrap class for responsive tables?

A) .table-auto

B) .table-responsive

C) .responsive-table

D) .table-fixed

8 / 30

8. How can you align text to the right using Bootstrap?

A) .align-right

B) .text-right

C) .float-end

D) .text-end

9 / 30

9. What does .p-0 do in Bootstrap?

A) Sets padding to default

B) Removes padding from all sides

C) Adds 0.5rem padding

D) Adds 0px padding only at the top

10 / 30

10. What variable controls the default font size in Bootstrap?

A) $primary-font-size

B) $default-font

C) $text-size

D) $font-size-base

11 / 30

11. What Bootstrap class reduces table cell spacing and padding?

A) .table-compact

B) .table-sm

C) .table-thin

D) .table-condensed

12 / 30

12. What class applies a border around an image?

A) .border

B) .img-border

C) .border-img

D) .border-light

13 / 30

13. What is the default column count in Bootstrap 5’s grid system?

A) 6

B) 16

C) 10

D) 12

14 / 30

14. Which Bootstrap version first removed jQuery dependency?

A) Bootstrap 4

B) Bootstrap 6

C) Bootstrap 5

D) Bootstrap 3

15 / 30

15. Where are Bootstrap's default style variables defined?

A) variables.json

B) theme.css

C) bootstrap.css

D) _variables.scss

16 / 30

16. What does the .text-reset class do?

A) Changes text to default black

B) Resets text color to the parent’s default color

C) Removes text styles

D) Makes text smaller

17 / 30

17. How do you make a Bootstrap input field display a placeholder?

A) placeholder="Text" attribute

B) .placeholder="Text"

C) .input-text="Text"

D) .form-placeholder="Text"

18 / 30

18. Which package manager can be used to install Bootstrap 5?

A) npm

B) Composer

C) Both A and B

D) yarn

19 / 30

19. What is the key advantage of using Bootstrap SCSS instead of CSS?

A) It speeds up Bootstrap’s JavaScript execution

B) It automatically compresses CSS

C) It reduces file size

D) It allows customization before compilation

20 / 30

20. Which class centers text horizontally?

A) .align-center

B) .text-mid

C) .text-center

D) .text-align-middle

21 / 30

21. Which class is used to create a spinner/loading animation?

A) .loader

B) .progress-spinner

C) .loading-circle

D) .spinner-border

22 / 30

22. What is the recommended method for customizing Bootstrap styles?

A) Directly modifying Bootstrap’s core files

B) Using Sass variables

C) Editing bootstrap.min.css

D) Using !important in custom CSS

23 / 30

23. How do you add a footer to a Bootstrap card?

A) .footer-card

B) .card-footer

C) .card-bottom

D) .card-foot

24 / 30

24. Which class is used for radio buttons in Bootstrap?

A) .radio-input

B) .form-radio

C) .form-check-input

D) .radio-button

25 / 30

25. What is the purpose of the .col class in Bootstrap 5?

A) To create a fixed-width column

B) To define custom breakpoints

C) To automatically adjust column width

D) To add padding

26 / 30

26. Which class is used to align columns at the bottom of a row?

A) .align-bottom

B) .align-self-bottom

C) .align-items-end

D) .align-row-bottom

27 / 30

27. Which class makes a flex container stack items vertically?

A) .stack-flex

B) .flex-column

C) .flex-row

D) .d-block

28 / 30

28. Which directive is used for Bootstrap tooltips in Angular?

A) ngTooltip

B) tooltip

C) bs-tooltip

D) data-bs-toggle="tooltip"

29 / 30

29. Which Bootstrap class applies a warning (yellow) background to a table row?

A) .table-caution

B) .table-yellow

C) .table-warning

D) .table-danger

30 / 30

30. How do you make an image appear as a thumbnail?

A) .img-border

B) .thumbnail-img

C) .img-thumbnail

D) .border-img

Your score is

The average score is 22%

Rate Your Experience!

Anonymous feedback

Thank you for your feedback! We appreciate your input.

HTML Quiz Test Online

Docker Quiz Test Online (30 random Questions)

10 Minutes Bootstrap Quiz Test Online

JSON Quiz Test Online (30 random Questions)

MongoDB Quiz Test Online (30 random Questions)

10 Minutes MongoDB Quiz Test Online

Related