Bootstrap MCQs – Bootstrap Tables

11.) What is the Bootstrap class for responsive tables?

A) .table-auto
B) .table-responsive
C) .table-fixed
D) .table-fixed

Answer: Option B

Explanation: The .table-responsive class makes tables scrollable on smaller screens while keeping them fully visible on larger ones.

12.) Which class is used to change the row color in Bootstrap tables?

A) .table-primary
B) .table-color
C) .table-row
D) .row-bg

Answer: Option A

Explanation: Bootstrap provides contextual classes like .table-primary, .table-success, .table-danger, etc., to apply different row colors.

13.) What class makes a table row appear more distinct on hover?

A) .table-highlight
B) .table-hover
C) .hover-effect
D) .row-hover

Answer: Option B

Explanation: The .table-hover class highlights rows when hovered.

14.) How do you create a hover effect on Bootstrap table rows?

A) .hover-table
B) .table-focus
C) .table-hover
D) .hover-rows

Answer: Option C

Explanation: The .table-hover class adds a hover effect on table rows, making them visually interactive.

15.) What Bootstrap class reduces table cell spacing and padding?

A) .table-sm
B) .table-condensed
C) .table-thin
D) .table-compact

Answer: Option A

Explanation: The .table-sm class reduces table padding, making it more compact.

16.) How do you highlight a specific row in a table?

A) .table-highlight
B) .row-active
C) .table-hover
D) .table-active

Answer: Option D

Explanation: The .table-active class makes a row appear slightly darker, helping to emphasize important data.

17.) Which Bootstrap class is used to style table headers?

A) .table-header
B) .table-title
C) .thead-dark
D) .thead-primary

Answer: Option C

Explanation: The .thead-dark class applies a dark background with light-colored text for table headers.

18.) How can you make a table take up the full width of the screen?

A) .table-full
B) .table-fluid
C) .w-100
D) .table-width

Answer: Option C

Explanation: The .w-100 utility class forces the table to take 100% of the parent container’s width.

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

A) .table-small
B) .table-sm
C) .table-compact
D) .table-condensed

Answer: Option B

Explanation: The .table-sm class reduces row height and padding, making the table more compact.

20.) What Bootstrap class centers text inside table cells?

A) .text-center
B) .table-align-center
C) .center-text
D) .table-text

Answer: Option A

Explanation: The .text-center class ensures that all text inside table cells is horizontally centered.

Leave a Reply

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