25 Dec Top Bootstrap Interview Questions and Answers

The top Bootstrap Interview Questions and Answers are given here. The level of questions is suitable for beginners as well as advanced web developers,

Let’s begin!

Ques 1. For responsive fixed width container, which Bootstrap class is used?

1. .container-fluid
2. .container-fixed
3. .container
4. None of the above

Ques 2. For a full-width container, which Bootstrap class is used?

1. .container-fluid
2. .container
3. .container-full
4. .container-responsive

Ques 3. How many columns make a responsive grid in Bootstrap?

1. 3
2. 4
3. 12
4. 6

Ques 4. Which HTML character code is used to set a close (x) symbol to the right of the alert?

1. '
2. »
3. ×
4. ß

Ques 5. Which class is used to add a link in the alert box?

1. .alert-link
2. .alert
3. .link
4. .alertlink

Ques 6. How to create badges in Bootstrap?

1. Use the .bd class
2. Use the .badge class
3. Use the .badge class
4. Use the .badge-pill class

Ques 7. Which Bootstrap class is used to make the badges more round?

1. .badge-round
2. .badge-circle
3. .badge-pill
4. .badge-rad

Ques 8. How to change the height of a Progress Bar in Bootstrap?

1. Use the .progress-bar-height class
2. Use the CSS height property
3. Use the height attribute
4. None of the above

Ques 9. How to change the width of a Progress Bar in Bootstrap?

1. Use width attribute
2. Use .progress-bar-width class
3. Use CSS width property
4. None of the above

Ques 10. Which class is used to add stripes to Progress Bar in Bootstrap?

1. Use the .striped class
2. Use the .progress-striped class
3. Use the .progress-bar-striped class
4. Use CSS

Ques 11. How to create an animated progress bar in Bootstrap?

1. Use .progress-bar-animated class
2. Use CSS
3. Use .progress-animated class
4. Use .animated class

Ques 12. Which class is used to create a basic Navigation Bar in Bootstrap?

1. .navbar class
2. .nav class
3. .nav-bar class
4. None of the above

Ques 13. Which Bootstrap class is used to center a Navigation Bar?

1. .justify-navbar-center class
2. .justify-content class
3. .justify-center class
4. .justify-content-center class

Ques 14. For the logo in a navigation bar, which Bootstrap class is used?

1. .navbar-logo class
2. .navbar-brand-logo class
3. .navbar-brand class
4. None of the above

Ques 15. How to fix a navigation bar on the top of the web page?

1. .fixed-top class
2. .top-fixed class
3. .fixed class
4. None of the above

Ques 16. Which Bootstrap class is used to resize the default pagination to a larger size?

1. .pagination-large
2. .pagination-lg
3. .lg-pagination
4. None of the above

Ques 17. Which class is used to highlight a pagination link (current page) with Bootstrap?

1. .highlight
2. pagination-active
3. pagination-highlight
4. .active class

Ques 18. How to right-align pagination with Bootstrap?

1. class=”pagination justify-content-end” (Answer)
2. class=”pagination justify-content”
3. class=”pagination justify-content-right”
4. class=”pagination justify-right”

Ques 19. How to create a circular image (shape image to circle) in Bootstrap?

1. .rounded class
2. .rounded-circle class
3. .round-circle class
4. None of the above

Ques 20. How to add rounded corners to an image in Bootstrap?

1. .rounded class
2. .rounded-corners class
3. .round class
4. .corners class

Ques 21. Which Bootstrap class is used for responsive images in Bootstrap?

1. .image-responsive
2. .responsive
3. .img-responsive
4. .img-fluid

Ques 22. Set Card Title in Bootstrap

1. .title class
2. .cardtitle class
3. .card-title class
4. .card-head-title class

Ques 23. Which class is used to create a grid of cards in Bootstrap?

1. .card-grid
2. .card-grids
3. .card-column
4. .card-columns

Ques 24. How to add an image to a card background in Bootstrap?

1. .card-overlay class
2. .overlay class
3. .card-img-overlay
4. .card-img

Ques 25. How to add a deck of cards in Bootstrap?

1. .deck class
2. .card-group class
3. .card-deck class
4. None of the above

Ques 26. How we can separate links in a Bootstrap Dropdown Menu?

1. .dropdown-divider class
2. .divider class
3. .dropdown-separate class
4. None of the above

Ques 27. How to create a drop left menu in Bootstrap?

1. Add the .drop-left class to the dropdown element
2. Add the .dropdown-left class to the dropdown element
3. Add the .dropleft class to the dropdown element
4. Add the .dropdown-menu-left class to the dropdown element

Ques 28. How to align the dropdown menu to the right in Bootstrap?

1. .dropdown-right-menu class
2. .dropdownright class
3. .dropdown-right class
4. .dropdown-menu-right class

Ques 29. How to resize a form control to be larger than the default size in Bootstrap?

1. .form-control-large
2. .form-large
3. .form-control-lg
4. .input-control-lg

Ques 30. How to create a checkbox form control in Bootstrap?

1. input type =”checkbox”
2. input type =”check-box”
3. input type =”text” checkbox
4. input type =”text” checkbox

Ques 31. Which Bootstrap class is used to create a bordered list group?

1. .list-group-bordered
2. .list-group
3. .group
4. None of the above

Ques 32. How to create a list group heading in Bootstrap?

1. .listgroup-heading class
2. .group-item-heading class
3. .list-group-heading class
4. .list-group-item-heading class

Ques 33. How to create a large Bootstrap modal wider than the default?

1. .modal-large
2. .modal-lg
3. .lg-modal
4. .wider-modal

Ques 34. How to add a transition effect that fades the Bootstrap modal in and out?

1. class=”modal-fade”
2. class=”modal” fade
3. class=”modalfade”
4. class=”modal fade”

Ques 35. How to center the modal vertically and horizontally within the page in Bootstrap?

1. <div class=”modal-dialog modal-centered”>
2. <div class=”modal-dialog modal-dialog-centered”>
3. <div class=”modal-dialog centered”>
4. <div class=”modal modal-dialog-centered”>

• 100 Android Interview Questions and Answers
• Java Interview Questions and Answers
• Java Basics Interview Questions
• Java Quiz
• Android Quiz
• jQuery Quiz
• HTML5 Quiz
• CSS3 Quiz