Take Bootstrap Online Test and evaluate your readiness before you appear for any interview or written test. Consisting of objective type questions from various important concepts of Bootstrap , this test presents you questions followed by four options. The correct answer, explanation, example provided with each question make it easier for you to to understand each concept well.
Who is this Bootstrap Online Test designed for?
All the Front End developers, UI/ UX developers and designers will find this test extremely useful. All freshers, BCA, BE, BTech, MCA and college students wanting to make a career in front end designing will be highly benefitted by this test.
Bootstrap Online Test topics
This online test covers topics like - Grid System, Fixed Layout, Fluid Layout, Responsive?Layout, Typography, Tables, Lists, List Groups, Forms, Input Groups, Buttons, Button Groups, Images, Media Objects, Icons, Navs, Navbar, Panels, Breadcrumbs, Pagination, Labels & Badges, Progress Bars, Jumbotron, Wells, Helper Classes etc.
1. Media Queries in Bootstrap allow you to move, show and hide content based on the viewport size.
a. True
b. False
Answer: a. True
Explanation: Media Query is a CSS technique that was introduced in CSS3. Media Query allows applying the style sheet properties on the web component based on the size of viewport.
2. Bootstrap's grid system allows up to _____ columns across the page.
a. 12
b. 13
c. 14
d. 11
Answer: a. 12
Explanation: Bootstraps grid system allows up to 12 columns across the page. If more than 12 columns are placed within a single row, each group of extra columns will wrap onto a new line.
3. How many Container class are there in Bootstrap?
a. 1
b. 2
c. 3
d. 4
Answer: b. 2
Explanation: Container is used to set the margin for dealing with responsive behavior of the layout. It is used to create boxed content. There are two types of container classes in Bootstraps.
.container (fixed-width)
.container-fluid (full-width)
4. The __________ class makes a table more compact by cutting cell padding in half.
a. .table-bordered
b. .table-responsive
c. .table-striped
d. .table-condensed
Answer: d. .table-condensed
Explanation: A basic Bootstrap table has a light padding and only horizontal dividers. The .table class adds basic styling to a table but the .table-condensed class makes a table more compact by cutting cell padding in half.
5. The Bootstrap grid system has four classes which defines screen size:
a. s, sm, mid, lg
b. xs, sm, md, lg
c. xs, sml, mid, lg
d. x, sm, md, lg
Answer: b. xs, sm, md, lg
Explanation: The Bootstrap grid system has four classes:
xs (for phones - screens less than 768px wide)
sm (for tablets - screens equal to or greater than 768px wide)
md (for small laptops - screens equal to or greater than 992px wide)
lg (for laptops and desktops - screens equal to or greater than 1200px wide)
6. In Bootstrap Grid System, you can turn any fixed-width layout into a full-width layout by changing the .container class to .container-fluid.
a. True
b. False
Answer: a. True
Explanation: Bootstrap Grid system having the two container class, .container (fixed width) and .container-fluid (full-width). We can turn any fixed -width layout into a full-width layout by changing the container class.
