Bootstrap MCQs – Bootstrap Flexbox & Utilities

21.) What does .p-0 do in Bootstrap?

A) Sets padding to default
B) Adds 0px padding only at the top
C) Adds 0.5rem padding
D) Removes padding from all sides

Answer: Option D

Explanation: The .p-0 class removes padding from all sides of an element.

22.) Which class is used to add space only at the bottom?

A) .mb-3
B) .m-bot-3
C) .bottom-margin-3
D) .margin-bottom

Answer: Option A

Explanation: The .mb-3 class applies a bottom margin to an element using Bootstrap’s spacing scale.

23.) How do you evenly distribute items along the main axis?

A) .justify-content-center
B) .justify-content-evenly
C) .align-content-around
D) .align-items-evenly

Answer: Option B

Explanation: The .justify-content-evenly class distributes items evenly with equal space on both sides.

24.) What does .opacity-50 do?

A) Makes an element semi-transparent (50% opacity)
B) Sets the background color to transparent
C) Hides the element completely
D) Applies a blur effect

Answer: Option A

Explanation: The .opacity-50 class reduces an element’s opacity to 50%, making it semi-transparent.

25.) Which class adds a shadow to an element?

A) .shadow-effect
B) .box-shadow
C) .shadow
D) .shadow-lg

Answer: Option C

Explanation: The .shadow class adds a default shadow effect to an element in Bootstrap.

26.) What does .h-100 do?

A) Sets an element’s height to 100% of its parent
B) Sets an element’s height to 100px
C) Makes the element visible
D) Increases the height gradually

Answer: Option A

Explanation: The .h-100 class makes an element take up the full height of its parent container.

27.) How do you make text bold using Bootstrap utilities?

A) .strong-text
B) .text-bold
C) .font-bold
D) .fw-bold

Answer: Option D

Explanation: The .fw-bold class makes text bold using Bootstrap’s font-weight utilities.

28.) Which class makes an element float to the left?

A) .left-float
B) .float-left
C) .float-start
D) .align-left

Answer: Option C

Explanation: The .float-start class floats an element to the left, following Bootstrap’s start-end system.

29.) How do you center a div horizontally in Bootstrap?

A) .mx-auto
B) .m-center
C) .align-center
D) .justify-center

Answer: Option A

Explanation: The .mx-auto class centers a block-level element horizontally by applying equal left and right margins.

30.) Which class removes borders from an element?

A) .border-none
B) .border-0
C) .no-border
D) .remove-border

Answer: Option B

Explanation: The .border-0 class removes all borders from an element.

Leave a Reply

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