Bootstrap Technology & Digital Applications 2 — Questions and Answers
Question 1: Which Bootstrap utility class applies a CSS flexbox display to an element?
- d-flex (Correct answer)
- flex-container
- display-flex
- d-flexbox
Correct answer: d-flex
Bootstrap's `d-flex` utility class sets `display: flex` on an element, enabling flexbox layout.
Question 2: In Bootstrap's responsive grid, what is the maximum number of columns in a single row?
- 6
- 12 (Correct answer)
- 16
- 24
Correct answer: 12
Bootstrap's grid system is based on 12 columns, so column class numbers must sum to 12 per row.
Question 3: Which Bootstrap component is best suited for showing a loading state while content is being fetched?
- Progress bar
- Spinner
- Placeholder (Correct answer)
- Badge
Correct answer: Placeholder
Bootstrap Placeholders (skeleton screens) are specifically designed to represent loading content with animated gray blocks.
Question 4: What does the Bootstrap class `text-truncate` do?
- Removes all text from the element
- Truncates overflowing text with an ellipsis (Correct answer)
- Limits text to three lines
- Converts text to uppercase
Correct answer: Truncates overflowing text with an ellipsis
`text-truncate` adds `overflow: hidden`, `text-overflow: ellipsis`, and `white-space: nowrap` to cut off long text with `...`.
Question 5: Which Bootstrap breakpoint targets screens 768px and wider?
- sm
- md (Correct answer)
- lg
- xl
Correct answer: md
Bootstrap's `md` breakpoint activates at a minimum width of 768px, targeting medium-sized devices like tablets.
Question 6: What Bootstrap class creates a fixed-top navigation bar that stays visible when the page scrolls?
- navbar-sticky
- fixed-top (Correct answer)
- sticky-nav
- navbar-fixed
Correct answer: fixed-top
The `fixed-top` class positions a navbar (or any element) at the top of the viewport using `position: fixed; top: 0`.
Question 7: In Bootstrap 5, which JavaScript plugin handles toggling visibility of off-canvas panels?
- Collapse
- Modal
- Offcanvas (Correct answer)
- Tab
Correct answer: Offcanvas
The Offcanvas plugin manages slide-in panels that appear from the sides, top, or bottom of the viewport.
Which Bootstrap utility class applies a CSS flexbox display to an element?