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 was Bootstrap originally called before its public release?

A) Twitter UI

B) Twitter Blueprint

C) Blueprint

D) Bootstrap.js

2 / 30

2. What is the default font family in Bootstrap 5?

A) Times New Roman

B) Arial

C) system-ui, -apple-system, sans-serif

D) Roboto

3 / 30

3. What class adds rounded corners to an image?

A) .img-rounded

B) .rounded

C) .border-radius

D) .round-img

4 / 30

4. Which command installs Bootstrap 5 using Yarn?

A) yarn bootstrap install

B) yarn add bootstrap

C) yarn get bootstrap

D) yarn download bootstrap

5 / 30

5. Which utility class applies equal margin on all sides?

A) .m-equal

B) .m-auto

C) .margin-all

D) .margin-equal

6 / 30

6. Which Bootstrap framework provides Angular components?

A) bootstrap-vue

B) next-bootstrap

C) react-bootstrap

D) ngx-bootstrap

7 / 30

7. Which class is used to add shadows to Bootstrap components?

A) .box-shadow

B) .shadow-effect

C) .component-shadow

D) .shadow-sm, .shadow-lg, .shadow-none

8 / 30

8. What attribute prevents a modal from closing when clicking outside?

A) data-bs-sticky="true"

B) data-bs-modal="lock"

C) data-bs-backdrop="static"

D) prevent-close

9 / 30

9. What tool can be used to remove unused Bootstrap classes from your project?

A) Bootstrap Trimmer

B) CSS Minifier

C) PurgeCSS

D) Bootstrap Cleaner

10 / 30

10. What is the valid method to include Bootstrap in a project?

A) Download Bootstrap files

B) Install via npm/yarn

C) All of the above

D) Use a CDN (Content Delivery Network)

11 / 30

11. What is the main benefit of using Bootstrap’s theming system?

A) Faster page load

B) Greater flexibility in design

C) No need for JavaScript

D) Automatic responsiveness

12 / 30

12. How do you nest Bootstrap columns inside another column?

A) Use .col-nest class

B) Use .container-nest

C) Wrap columns inside another .col-*

D) Nesting is not supported

13 / 30

13. What class is used to create a dark-themed navbar?

A) .nav-dark

B) .navbar-black

C) .navbar-light bg-dark

D) .navbar-dark bg-dark

14 / 30

14. What is the correct way to activate a Bootstrap tooltip?

A) tooltip-enable="true"

B) data-hover="tooltip"

C) data-bs-toggle="tooltip"

D) show-tooltip="on"

15 / 30

15. Which Bootstrap class is used to align navigation items in a navbar?

A) .navbar-nav

B) .nav-align

C) .navbar-items

D) .navbar-list

16 / 30

16. What Bootstrap class is used to center an image?

A) .image-align

B) .img-center

C) .mx-auto

D) .text-center

17 / 30

17. How do you push an item to the right inside a flex container?

A) .justify-content-start

B) .ms-auto

C) .justify-content-end

D) .me-auto

18 / 30

18. Which company currently maintains Bootstrap?

A) Meta

B) Open Source Community

C) Google

D) Twitter

19 / 30

19. Which class is used to make an item take up all available space in a Flexbox container?

A) .expand-flex

B) .w-100

C) .flex-full

D) .flex-grow-1

20 / 30

20. What class applies a border around an image?

A) .img-border

B) .border

C) .border-light

D) .border-img

21 / 30

21. What class is used to create inline forms in Bootstrap?

A) .form-inline

B) .inline-form

C) .form-row

D) .form-group-inline

22 / 30

22. Where should the Bootstrap 5 <script> tag be placed in an HTML file?

A) At the end of <body>

B) Before <html> starts

C) Anywhere in the file

D) Inside <head>

23 / 30

23. Which class aligns text to be fully justified?

A) .text-block

B) Bootstrap does not support justified text

C) .justify-text

D) .text-justify

24 / 30

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

A) 6

B) 12

C) 10

D) 16

25 / 30

25. Which class centers text horizontally?

A) .text-mid

B) .text-align-middle

C) .align-center

D) .text-center

26 / 30

26. Which Bootstrap class makes a table compact by reducing padding?

A) .table-sm

B) .table-condensed

C) .table-small

D) .table-compact

27 / 30

27. How do you prevent Flexbox items from wrapping to the next line?

A) .d-inline-flex

B) .flex-no-wrap

C) .no-wrap

D) .flex-nowrap

28 / 30

28. Which Bootstrap-Vue directive initializes tooltips?

A) v-b-tooltip

B) vue-tooltip

C) tooltip-init

D) b-tooltip

29 / 30

29. How do you disable the default Bootstrap shadows?

A) $enable-shadows: false;

B) $disable-shadows: true;

C) $box-shadow: none;

D) $shadow-none: true;

30 / 30

30. Which class is used to create a tab-based navigation in Bootstrap?

A) .navbar-tabs

B) .nav-tabs

C) .tabs-group

D) .tab-nav

Your score is

The average score is 22%

Rate Your Experience!

Anonymous feedback

Thank you for your feedback! We appreciate your input.

10 Minutes Docker Quiz Test Online

10 Minutes Bootstrap Quiz Test Online

10 Minutes JSON Quiz Test Online

JSON Quiz Test Online (30 random Questions)

MongoDB Quiz Test Online (30 random Questions)

Docker Quiz Test Online (30 random Questions)

Related