wayground logo

Free Printable Worksheets

NEW

Font size

S
M
L
XL
Worksheets

bootstrap let's play

Total questions: 15

Worksheet time: 9mins

Name
Class
Date
1.

Bootstrap's grid has ______ columns across the page

a)

1

b)

4

c)

8

d)

12

2.

What are the Bootstrap classes for creating columns?

a)

.large .medium ,small .extrasmall

b)

.col-1 .col-2 .col-3 .col-4

c)

.#-col .sm-#-col .md-#-col .lg-#-col .xl-#-col

d)

.col-# .col-sm-# .col-md-# .col-lg-# .col-xl-#

3.

sm, md, lg, and xl represent ___________

a)

Size of the row

b)

Size of the column

c)

Size of the device's screen

d)

Nothing

4.

While building a Bootstrap grid we use ________

a)

spans

b)

divs

c)

headers

d)

buttons

5.

If I want my grid to have 4 columns on a large screen, which column class would I use? (remember, all columns in a row should add up to 12!)

a)

col-2

b)

col-lg-12

c)

col-sm-4

d)

col-lg-3

6.

Which of the following bootstrap style of button indicates a successful or positive action?

a)

.btn

b)

.btn-primary

c)

.btn-success

d)

.btn-info

7.

The .container-fluid class provides

a)

fixed width container

b)

to create a form

c)

table format

d)

to create a form

8.

medium devices are defined as having a screen width from

a)

992 to 1199 pixels

b)

768 to 991 pixels

c)

900 to 1000 pixels

d)

512 pixels to 2048 pixels

9.

which class makes rounded corner images

a)

img-round-corner

b)

img-circle

c)

img-rounded

d)

img-rnd

10.

which class is used to create a button as link in bootstrap

a)

btn-url

b)

btn-anchor

c)

btn-hyper

d)

btn-link

11.

What is the correct way to add a default-styled button to an <a> tag?

a)

<a href="#" class="btn btn-default">Button</a>

b)

<a href="#" class="btn-default">Button</a>

c)

<a href="#" class="btn default">Button</a>

d)

<a href="#" class="btn">Button</a>

12.

Which of the following correctly creates a thumbnail of the CodeHS logo that links to https://codehs.com?

a)

<a href="https://codehs.com/">

<img src="codehs_logo.jpg" alt="CodeHS Logo">

</a>

b)

<a href="https://codehs.com/" class="thumbnail">

<img src="codehs_logo.jpg" alt="CodeHS Logo">

</a>

c)

<a href="https://codehs.com/">

<img class="thumbnail" src="codehs_logo.jpg" alt="CodeHS Logo">

</a>

d)

<a href="codehs_logo.jpg" class="thumbnail">

<img src="https://codehs.com/" alt="CodeHS Logo">

</a>

13.

Why might you decide to use a dropdown menu on your website?

a)

To group options together in a way that makes senseTo group options together in a way that makes sense

b)

To have a simple interface without too many buttons

c)

To save space and keep a clean website layout

d)

All of the Above

14.

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

15.

Which class is used to create a basic list group?

a)

.grouped-list

b)

.group-list

c)

.list-group

d)

.list-grouplist