Latest Bootstrap Interview Questions & Answer for 2024

Bootstrap, a widely acclaimed open-source front-end framework, was developed by Mark Otto and Jacob Thornton to simplify and enhance web development. With an array of pre-designed HTML, CSS, and JavaScript components, Bootstrap facilitates the creation of responsive and visually appealing websites. Among its standout features are a versatile grid system, a comprehensive suite of pre-built components such as navigation bars, buttons, forms, and modals, and robust JavaScript plugins that boost functionality. Emphasizing a mobile-first approach, Bootstrap ensures websites are optimized for all screen sizes. Customization is seamless, allowing developers to adapt designs to their specific needs using custom CSS or by integrating pre-designed themes. Overall, Bootstrap significantly reduces the time and effort required for front-end development, guaranteeing a consistent and professional appearance across various web projects.

 

1. Which of the following class in Bootstrap is used to provide a responsive fixed width container?

a) .container-fixed

b) .container-fluid

c) .container

d) All of the above

Answer: (a) container-fixed

2) Which of the following statements is/are correct about Bootstrap 4?
a).It provides a free front - end framework
b).It is a completely open - source product
c).It gives the ability to create responsive designs
d).All of the above

Answer: d. All of the above

3) Is Bootstrap3 mobile-first?
a).True
b).False
c).Can't say
d).May be

Answer: (a) True

4. Which of the following class in Bootstrap is used to create a dropdown menu?

a) .dropdown

b) .select

c) .select-list

d) None of the above

 

Answer: a

5) Which of the following contextual class is used for the purpose of showing warning?
a).active
b).danger
c).warning
d).None of the above

Answer: b. .danger

6) How many columns are allowed in a bootstrap grid system?
a).2
b).12
c).3
d).5

Answer: (b) 12

7. Which of the following bootstrap styles can be used to create a default progress bar?

a) .nav-progress

b) .link-progress-bar

c) .progress, .progress-bar

d) All of the mentioned

Answer: c

8) Which of the following classes can be used to make image with rounded corners in Bootstrap 4 ?
a).img-rounded
b).rounded
c)Both (a) and (b)
d)None of the above

Answer: b. .rounded

9) Which of the following class in bootstrap is used to create a big box for calling extra attention?
a).box
b).container
c).container-fluid
d).jumbotron

Answer: (d) .jumbotron

10. Which plugin is used to cycle through elements, like a slideshow?

a) Carousel Plugin

b) Modal Plugin

c) Tooltip Plugin

d) None of the mentioned

Answer: a

11) What is the font - size of <h3> in Bootstrap 4 by default?
a).19 px
b).28 px
c).20 px
d).None of the above

Answer: (b). 28 px

12 Which of the following class in Bootstrap is used to create a dropdown menu?
a).dropdown
b).select
c).select-list
d).None of the above

Answer: (a) .dropdown

13. Which of the following is correct about the data-animation Data attribute of the Popover Plugin?

a) Gives the popover a CSS fade transition

b) Inserts the popover with HTML

c) Indicates how the popover should be positioned

d) Assigns delegated tasks to the designated targets

Answer: (a) Gives the popover a CSS fade transition

 

14) What does the following meta tag do?

<meta name="viewport" content="width=device-width, initial-scale=1">
a).Tells the browser to look for media queries in the CSS file
b).Makes the web page responsive automatically
c).Prevents browsers from scaling desktop websites on mobile
d).None of the above options are correct

Answer: c. Prevents browsers from scaling desktop websites on mobile

15) Which of the following class in Bootstrap is used to create a basic list group?
a).grouped-list
b).select-list
c).list-group
d).list-grouped

Answer: (c) .list-group

16. The content must be placed within ________ in Bootstrap.

a) Rows

b) Containers

c) Columns

d) None of the mentioned

Answer: © Columns

 

17) Why is the Glyphicons used in Bootstrap 4?
a).Slideshow
b).Graphic images
c).Animations
d).For the purpose of providing different icons

Answer: (d). For the purpose of providing different icons

18) The class used to shape an image to a circle is -
a).img-rounded
b).img-circle
c).img-rounded
d).None of the above

Answer: (b) .img-circle

19. Which of the following class applies hover color to a specific row or a cell?

a) Warning

b) Active

c) Success

d) Danger

Answer: (b) Active

20) Which of the following class can be used to make the images and other content in a web page automatically adjusts to fit the size of the screen?
a).img-rounded
b).img-fluid
c).img-circle
d).None of the above

Answer: (b). .img-fluid

21) Which of the following class in Bootstrap is used to add a zebra-stripe to a table?
a).tab-striped
b).zebra-strip
c).table-stripped
d).table-striped

Answer: (d) .table-striped

 

22. Which of the following bootstrap version should be used to support IE9?

a) Bootstrap 1

b) Bootstrap 2

c) Bootstrap 3

d) Bootstrap 4

Answer: ©  Bootstrap 3

23) Which of the following statements is true about Jumbotron in Bootstrap 4?
a)The Jumbotron in Bootstrap 4 can be used to increase the size of headings and also insert a large amount of margin for the purpose of landing page control.
b).In order to create a container with the help of using class .jumbotron.
c).Both (a) and (b) are correct
d).None of the above options is correct

Answer: c. Both (a) and (b) are correct.

 

24) Which of the following class in Bootstrap is used to create a large button?
a).btn-xl
b).btn-lrg
c).btn-large
d).btn-lg

Answer: (d).btn-lg

 

25. Which of the following is the default size of H3 bootstrap heading?

a) 12px

b) 24px

c) 36px

d) 48px

Answer: (b)  24px

26) Which of the following is the correct heading size for <h5> in Bootstrap 4?

a).20 px
b).16 px
c).12 px
d).None of the above

Answer: (a). 20 px

 

27) Which of the following plugin in Bootstrap is used to create a modal window?
a).popup
b).alert
c).modal
d).window

Answer: (c) modal

28) Which of the following plugins can be used to cycle through the elements like a slideshow?
a).Slideshow
b).Carousel
c).Scrollspy
d).None of the above

Answer: b. Carousel

 

29) Which of the following class in Bootstrap is used to create basic pagination?
a).page
b).pagin
c).paginate
d).pagination

Answer: (d) .pagination

 

30. Bootstrap is used for __________

a) Web applications

b) IoT

c) Bigdata

d) Data

Answer: (a) Web applications

31) Which of the following layout can be used to provide 100% width in Bootstrap 4?
a).Fluid Layout
b).Fixed Layout
c).Both (a) and (b) are correct
d).None of the above options is correct

Answer: (a). Fluid Layout

 

32) Which of the following class in Bootstrap is used to create a badge?
a).tag
b).badge
c).page
d).flag

Answer: (b) .badge

 

33.It contains __________ based design templates for topography.

a) SMTP

b) HTML

c) MQTP

d) CoAP

Answer: (b) HTML

34) Which among the following grid classes can be used for desktop?
a).md
b).sm
c).xs
d).None of the above

Answer: (a). md

35) Which of the following class in Bootstrap is used to create a panel?

a).panel
b).container
c).box
d).jumbotron

Answer: (a) .panel

36. Bootstrap is a front end development only.

a) True

b) False

Answer: (a) true

37) In Bootstrap 4, the contents can be placed within which of the following elements?
a).Columns
b).Containers
c).Rows
d).None of the above

Answer: a. Columns

 

38) Using which of the following, we can create a pager in Bootstrap?

a).carousel
b).collapse
c).pager
d).None of the above

Answer: (c) .pager

 

39. __________ stars and __________forks are there in bootstrap.

a) 111,600 and 51,500

b) 51,500 and 111,600

c) 125,124 and 36,154

d) 36,154 and 125,124

Answer: (a)  111,600 and 51,500

 

40) Which of the following is the main difference between an ID and a class?
a).Classes are for use with spans and IDs are for use with DIVs
b).IDs are supposed to be only used once per page but Classes can be used multiple times per page, and one element can have more than one Class but should have only one I
c).IDs are better than classes
d).None of the above

Answer: (b). IDs are supposed to be only used once per page but classes can be used multiple times per page, and one element can have more than one class but should have only one ID

 

41) The class in Bootstrap which is used to specify the collapsible elements is -
a).collapse
b).carousel
c).pager
d).None of the above

Answer: (a) . collapse

 

42. Bootstrap was originally named as __________

a) Twitter Bootstrap

b) Twinkle Bootstrap

c) Twitter Blueprint

d) Twinkle Blueprint

Answer: (c) Twitter Blueprint

43) Which of the following class in Bootstrap is used for creating the large size modals?
a).modal-large
b).modal-sm
c).modal-big
d).modal-lg

Answer: (d) .modal-lg

 

44) How many types of container classes are there in Bootstrap 4?
a).1
b).2
c).3
d).None of the above

Answer: b. 2

 

45. Bootstrap 4 has how many versions?

a) 4 versions

b) 3 versions

c) Only one version

d) 2 versions

Answer: d

46) Which of the following classes amongst these options is/are contextual?
a).warning
b).info
c).danger
d).All of the given options are correct

Answer: d. All of the given options are correct

 

47) Which of the following class in Bootstrap is used to indicate the uppercased text?
a).text-capitalize
b).text-upper
c).uppercase
d).text-uppercase

Answer: (d) .text-uppercase

 

48. Sass stands for __________

a) Syntactically awesome Spreadsheets

b) Syntactically awesome Stylesheets

c) Scripting awesome Stylesheets

d) Scripting awesome Spreadsheets

Answer: (b) Syntactically awesome Stylesheets

49) Which of the following options is/are supported in Bootstrap 4?
a).Sass
b).Flexbox
c).Both (a) and (b)
d).None of the above

Answer: c. Both (a) and (b)

 

50. Bootstrap 4 uses what?

a) Pixels

b) Root ems

c) Less

d) Pager component

Answer: b Roots

 

Categories: web designing web development digital marketing css bootstrap javascript jquery