Bootstrap MCQs – Bootstrap Customization

21.) What is the recommended way to override Bootstrap’s default spacing (margins & paddings)?

A) Modify $spacer variables in _variables.scss
B) Use inline styles in HTML
C) Write custom CSS classes
D) Modify Bootstrap’s core CSS file

Answer: Option A

Explanation: Bootstrap uses $spacer as the base for margin (m- classes) and padding (p- classes). Changing $spacer updates all spacing-related utilities globally.

22.) Which Bootstrap SCSS file defines global styles and root variables?

A) _bootstrap.scss
B) _global.scss
C) _variables.scss
D) _root.scss

Answer: Option D

Explanation: The _root.scss file contains global styles, including CSS custom properties (CSS variables). These variables allow runtime theming using :root.

23.) How do you change the hover effect of Bootstrap buttons globally?

A) Modify Bootstrap’s bootstrap.css file
B) Add a .btn:hover class in custom CSS
C) Override $btn-hover-bg in _variables.scss
D) Use JavaScript to change the hover style

Answer: Option C

Explanation: $btn-hover-bg controls the hover background color for Bootstrap buttons. Overriding this ensures a consistent look across all buttons.

24.) Which Bootstrap function is used to create responsive font sizes?

A) scale-font-size()
B) responsive-font-size()
C) dynamic-font()
D) rfs()

Answer: Option D

Explanation: Bootstrap includes the Responsive Font Sizes (RFS) function, rfs(), which automatically adjusts font sizes based on viewport size.

25.) How do you modify the default gutter width in Bootstrap’s grid system?

A) Change $grid-gutter-width in _variables.scss
B) Add custom .gutter classes in CSS
C) Use grid-gutter: 0px; in HTML
D) Remove Bootstrap’s grid system and write custom CSS

Answer: Option A

Explanation: $grid-gutter-width determines the default spacing between columns in the Bootstrap grid. Modifying this value allows for customized layouts.

Pages: 1 2 3

Leave a Reply

Your email address will not be published. Required fields are marked *