- Bootstrap Tutorial
- Bootstrap - Home
- Bootstrap - Overview
- Bootstrap - Environment Setup
- Bootstrap - RTL
- Bootstrap - CSS Variables
- Bootstrap - Color Modes
- Bootstrap Layouts
- Bootstrap - Breakpoints
- Bootstrap - Containers
- Bootstrap - Grid System
- Bootstrap - Columns
- Bootstrap - Gutters
- Bootstrap - Utilities
- Bootstrap - CSS Grid
- Bootstrap Content
- Bootstrap - Reboot
- Bootstrap - Typography
- Bootstrap - Images
- Bootstrap - Tables
- Bootstrap - Figures
- Bootstrap Components
- Bootstrap - Accordion
- Bootstrap - Alerts
- Bootstrap - Badges
- Bootstrap - Breadcrumb
- Bootstrap - Buttons
- Bootstrap - Button Groups
- Bootstrap - Cards
- Bootstrap - Carousel
- Bootstrap - Close button
- Bootstrap - Collapse
- Bootstrap - Dropdowns
- Bootstrap - List Group
- Bootstrap - Modal
- Bootstrap - Navbars
- Bootstrap - Navs & tabs
- Bootstrap - Offcanvas
- Bootstrap - Pagination
- Bootstrap - Placeholders
- Bootstrap - Popovers
- Bootstrap - Progress
- Bootstrap - Scrollspy
- Bootstrap - Spinners
- Bootstrap - Toasts
- Bootstrap - Tooltips
- Bootstrap Forms
- Bootstrap - Forms
- Bootstrap - Form Control
- Bootstrap - Select
- Bootstrap - Checks & radios
- Bootstrap - Range
- Bootstrap - Input Groups
- Bootstrap - Floating Labels
- Bootstrap - Layout
- Bootstrap - Validation
- Bootstrap Helpers
- Bootstrap - Clearfix
- Bootstrap - Color & background
- Bootstrap - Colored Links
- Bootstrap - Focus Ring
- Bootstrap - Icon Link
- Bootstrap - Position
- Bootstrap - Ratio
- Bootstrap - Stacks
- Bootstrap - Stretched link
- Bootstrap - Text Truncation
- Bootstrap - Vertical Rule
- Bootstrap - Visually Hidden
- Bootstrap Utilities
- Bootstrap - Backgrounds
- Bootstrap - Borders
- Bootstrap - Colors
- Bootstrap - Display
- Bootstrap - Flex
- Bootstrap - Floats
- Bootstrap - Interactions
- Bootstrap - Link
- Bootstrap - Object Fit
- Bootstrap - Opacity
- Bootstrap - Overflow
- Bootstrap - Position
- Bootstrap - Shadows
- Bootstrap - Sizing
- Bootstrap - Spacing
- Bootstrap - Text
- Bootstrap - Vertical Align
- Bootstrap - Visibility
- Bootstrap Demos
- Bootstrap - Grid Demo
- Bootstrap - Buttons Demo
- Bootstrap - Navigation Demo
- Bootstrap - Blog Demo
- Bootstrap - Slider Demo
- Bootstrap - Carousel Demo
- Bootstrap - Headers Demo
- Bootstrap - Footers Demo
- Bootstrap - Heroes Demo
- Bootstrap - Featured Demo
- Bootstrap - Sidebars Demo
- Bootstrap - Dropdowns Demo
- Bootstrap - List groups Demo
- Bootstrap - Modals Demo
- Bootstrap - Badges Demo
- Bootstrap - Breadcrumbs Demo
- Bootstrap - Jumbotrons Demo
- Bootstrap-Sticky footer Demo
- Bootstrap-Album Demo
- Bootstrap-Sign In Demo
- Bootstrap-Pricing Demo
- Bootstrap-Checkout Demo
- Bootstrap-Product Demo
- Bootstrap-Cover Demo
- Bootstrap-Dashboard Demo
- Bootstrap-Sticky footer navbar Demo
- Bootstrap-Masonry Demo
- Bootstrap-Starter template Demo
- Bootstrap-Album RTL Demo
- Bootstrap-Checkout RTL Demo
- Bootstrap-Carousel RTL Demo
- Bootstrap-Blog RTL Demo
- Bootstrap-Dashboard RTL Demo
- Bootstrap Useful Resources
- Bootstrap - Questions and Answers
- Bootstrap - Quick Guide
- Bootstrap - Useful Resources
- Bootstrap - Discussion
Bootstrap - Mock Test
This section presents you various set of Mock Tests related to Bootstrap Framework. You can download these sample mock tests at your local machine and solve offline at your convenience. Every mock test is supplied with a mock test key to let you verify the final score and grade yourself.
Bootstrap Mock Test II
Q 1 - Which of the following bootstrap style of button indicates a successful or positive action?
Answer : C
Explanation
.btn-success − Indicates a successful or positive action.
Q 2 - Which of the following bootstrap style of button represents a contextual button for informational alert messages?
Answer : D
Explanation
.btn-info − Contextual button for informational alert messages.
Q 3 - Which of the following bootstrap style of button indicates caution should be taken with this action?
Answer : A
Explanation
.btn-warning − Indicates caution should be taken with this action.
Q 4 - Which of the following bootstrap style of button indicates a dangerous or potentially negative action?
Answer : B
Explanation
.btn-danger − Indicates a dangerous or potentially negative action.
Q 5 - Which of the following bootstrap style of button deemphasize a button by making it look like a link while maintaining button behavior?
Answer : C
Explanation
.btn-link − Deemphasize a button by making it look like a link while maintaining button behavior.
Q 6 - Which of the following bootstrap style of button makes the button size large?
Answer : A
Explanation
.btn-lg − This makes the button size large.
Q 7 - Which of the following bootstrap style of button makes the button size small?
Answer : B
Explanation
.btn-sm − This makes the button size small.
Q 8 - Which of the following bootstrap style of button makes the button size extra small?
Answer : C
Explanation
.btn-xs − This makes the button size extra small.
Q 9 - Which of the following bootstrap style of button creates block level buttons that span the full width of a parent?
Answer : D
Explanation
.btn-block − This creates block level buttons that span the full width of a parent.
Q 10 - Which of the following bootstrap style of image gives the image rounded corners?
Answer : A
Explanation
.img-rounded − adds border-radius:6px to give the image rounded corners.
Q 11 - Which of the following bootstrap style of image makes the entire image round by adding border-radius:500px?
Answer : B
Explanation
.img-circle − makes the entire image round by adding border-radius:500px.
Q 12 - Which of the following bootstrap style of image adds a bit of padding and a gray border?
Answer : C
Explanation
.img-thumbnail − adds a bit of padding and a gray border.
Q 13 - Which of the following bootstrap style is used for a basic button group?
Answer : A
Explanation
.btn-group − This class is used for a basic button group. Wrap a series of buttons with class .btn in .btn-group.
Q 14 - Which of the following bootstrap style helps to combine sets of <div class="btn-group"> into a <div class="btn-toolbar"> for more complex components?
Answer : B
Explanation
.btn-toolbar − This helps to combine sets of <div class="btn-group"> into a <div class="btn-toolbar"> for more complex components.
Q 15 - Which of the following bootstrap style can be applied to button group instead of resizing each button?
Answer : C
Explanation
.btn-group-lg − This class can be applied to button group instead of resizing each button.
Q 16 - Which of the following bootstrap style makes a set of buttons appear vertically stacked rather than horizontally?
Answer : C
Explanation
.btn-group-vertical − This class make a set of buttons appear vertically stacked rather than horizontally.
Q 17 - Which of the following bootstrap styles are used to create a tabbed navigation?
Answer : A
Explanation
To create a tabbed navigation .menu: Start with a basic unordered list with the base class of .nav and add class .nav-tabs.
Q 18 - Which of the following bootstrap styles are used to create a pills navigation?
Answer : B
Explanation
To create a pills navigation .menu: Start with a basic unordered list with the base class of .nav and add class .nav-pills.
Q 19 - Which of the following bootstrap styles are used to create a vertical pills navigation?
Answer : C
Explanation
You can stack the pills vertically using the class ..nav-stacked along with the classes: .nav, .nav-pills.
Q 20 - Which of the following bootstrap styles are used to create a justified tabs navigation?
Answer : D
Explanation
You can make tabs or pills of equal widths as of their parent at screens wider than 768px using class .nav-justified along with .nav, .nav-tabs or .nav, .nav-pills respectively. On smaller screens, the .nav links are stacked.
Q 21 - Which of the following bootstrap styles are used to create a disabled tab in tabs navigation?
A - .nav, .nav-tabs, .disabled
Answer : A
Explanation
For each of the .nav classes, if you add the .disabled class, it will create a gray link that also disables the :hover state.
Q 22 - Which of the following bootstrap styles are used to add a dropdown to a tab?
B - .nav, .nav-tabs, dropdown-.menu
Answer : B
Explanation
To add dropdowns to tab: Start with a basic unordered list with the base class of .nav; Add the class .nav-tabs.; Now add an unordered list with a .dropdown-menu class.
Q 23 - Which of the following bootstrap styles are used to add a dropdown to a pills?
B - .nav, .nav-pills, .dropdown-.menu
Answer : B
Explanation
To add dropdowns to tab: Start with a basic unordered list with the base class of .nav; Add the class .nav-pills.; Now add an unordered list with a .dropdown-menu class.
Q 24 - Which of the following bootstrap style is used to add button to .navbar?
Answer : A
Explanation
You can add buttons using class .navbar-.btn to <button> elements not residing in a <form> to vertically center them in the .navbar. ..navbar-.btn can be used on <a> and <input> elements.
Q 25 - Which of the following bootstrap style is used to add text to .navbar?
Answer : A
Explanation
To wrap strings of text in an element use the class .navbar-text. This is usually used with <p> tag for proper leading and color.
Answer Sheet
| Question Number | Answer Key |
|---|---|
| 1 | C |
| 2 | D |
| 3 | A |
| 4 | B |
| 5 | C |
| 6 | A |
| 7 | B |
| 8 | C |
| 9 | D |
| 10 | A |
| 11 | B |
| 12 | C |
| 13 | A |
| 14 | B |
| 15 | C |
| 16 | C |
| 17 | A |
| 18 | B |
| 19 | C |
| 20 | D |
| 21 | A |
| 22 | B |
| 23 | B |
| 24 | A |
| 25 | A |