Bootstrap MCQs – Setup and Configuration

Mastering Bootstrap 5 setup and configuration is essential for front-end developers. This chapter covers CDN setup, npm installation, Sass customization, and key Bootstrap configuration settings. These top multiple-choice questions (MCQs) will help you prepare for technical interviews and enhance your knowledge of Bootstrap 5 setup and configuration.

1.) What is the easiest way to add Bootstrap 5 to a web project?

A) Use a CDN (Content Delivery Network)
B) Download Bootstrap files manually
C) Install using npm or yarn
D) Copy code from another website

Answer: Option A

Explanation: The fastest and easiest way to add Bootstrap is by linking to its CDN-hosted CSS and JavaScript files.

2.) Where should the Bootstrap 5

A) Inside <head>
B) At the end of <body>
C) Before <html> starts
D) Anywhere in the file

Answer: Option B

Explanation: Placing the Bootstrap <script> at the end of the improves performance by ensuring the page loads first.

3.) Which package manager can be used to install Bootstrap 5?

A) npm
B) yarn
C) Composer
D) Both A and B

Answer: Option D

Explanation: Bootstrap 5 can be installed using npm (npm install bootstrap) or yarn (yarn add bootstrap).

4.) Which command installs Bootstrap 5 using npm?

A) npm get bootstrap
B) npm add bootstrap
C) npm install bootstrap
D) npm download bootstrap

Answer: Option C

Explanation: The correct npm command for installing Bootstrap 5 is npm install bootstrap.

5.) Which file extension is used for Bootstrap’s main stylesheet?

A) .js
B) .scss
C) .css
D) .bootstrap

Answer: Option C

Explanation: Bootstrap’s main stylesheet file is named bootstrap.min.css.

6.) Does Bootstrap 5 require jQuery?

A) Yes
B) No
C) Only for dropdowns
D) Only for modals

Answer: Option B

Explanation: Bootstrap 5 removed jQuery dependency, making it lighter and faster.

7.) What is the purpose of Popper.js in Bootstrap 5?

A) Manages positioning of tooltips and popovers
B) Adds animations
C) Loads JavaScript files
D) Handles AJAX requests

Answer: Option A

Explanation: Popper.js is required for tooltips, popovers, and dropdown positioning.

8.) Which preprocessor does Bootstrap 5 use for customizing styles?

A) LESS
B) SASS
C) SCSS
D) Both B and C

Answer: Option D

Explanation: Bootstrap 5 supports SASS and SCSS for customizing styles efficiently.

9.) How do you import Bootstrap 5 in a Sass file?

A) @import “bootstrap”;
B) @import “~bootstrap/scss/bootstrap”;
C) @import “bootstrap.min.css”;
D) @import “https://bootstrapcdn.com/bootstrap.css”;

Answer: Option B

Explanation: When using SASS, Bootstrap 5 is imported using @import “~bootstrap/scss/bootstrap”;.

10.) Which Bootstrap 5 class is used to make a container fluid (full-width)?

A) .container-full
B) .container-wide
C) .container-fluid
D) .container-max

Answer: Option C

Explanation: .container-fluid makes an element stretch full-width across all screen sizes.

Pages: 1 2 3

Leave a Reply

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