Bootstrap Bootstrap 4

Question 1

What Bootstrap component would you use to display step-by-step progress through a multi-step form?

Accepted Answer

breadcrumb

Answer

While not a 'stepper', Bootstrap's `breadcrumb` is commonly used to indicate progress through multi-step processes; `progress` bars show completion percentage.

Question 2

Which Bootstrap class creates a responsive image that scales down to fit its container but never scales up beyond its natural size?

Accepted Answer

img-fluid

Answer

`img-fluid` applies `max-width: 100%` and `height: auto` so images shrink within their container but never enlarge beyond their natural dimensions.

Question 3

What is the effect of adding `data-bs-toggle='collapse'` to a button in Bootstrap?

Accepted Answer

Shows or hides a targeted collapsible element without writing JavaScript

Answer

The `data-bs-toggle='collapse'` attribute initializes Bootstrap's Collapse plugin on the button, toggling the visibility of the element referenced by `data-bs-target`.

Question 4

In Bootstrap, which breakpoint class prefix targets screens 768px wide and above?

Accepted Answer

md

Answer

The `md` breakpoint targets viewports ≥768px, making `col-md-*` classes active at medium and larger screen sizes.

Question 5

What Bootstrap class would you add to a `<form>` element to display form controls side-by-side in a horizontal row?

Accepted Answer

row g-3 align-items-center

Answer

In Bootstrap 5, `form-inline` was removed; the recommended approach is using `row g-3 align-items-center` with grid columns to create inline/horizontal forms.

Bootstrap Practice Test

Bootstrap Practice Test

Bootstrap Bootstrap 4