Bootstrap Knowledge Test: Take 2
Which of the following bootstrap style of button indicates a successful or positive action?
.btn-success
What are the Bootstrap classes for creating columns?
.col-# .col-sm-# .col-md-# .col-lg-# .col-xl-#
What is the difference between .container and .container-fluid?
.container-fluid constantly updates to fit the width of the window, while .container will update occasionally as the window is resized.
Which of the following correctly creates a thumbnail of the CodeHS logo that links to https://codehs.com?
<a href="https://codehs.com/" class="thumbnail"> <img src="codehs_logo.jpg" alt="CodeHS Logo"> </a>
Which of the following correctly creates a jumbotron on your website?
<div class="container"> <div class="jumbotron"> <h1>This text will be in a jumbotron</h> </div> </div>
Which of the following will correctly display a page header with subtext?
<div class="page-header"> <h1> This is the header <small> This is the subtext </small> </h1> </div>
Which of the following creates a table that is responsive to screens of different sizes?
<div class="table-responsive"> <table class="table"> ... </table> </div>
Which of the following does not correctly create a navigation bar?
<nav class="navey-nav navbar-right"> <div class="container"> </div> </nav>
Fill in the blank: ________ are a great way to pack more options into a navigation bar while keeping the interface clean and simple.
Dropdown menus
True or False: If you are adding your own CSS sheet, make sure your CSS file comes before the Bootstrap CSS file.
False
True or False: It is impossible to have more than one jumbotron on a given page.
False
True or False: The number of columns in a row depends on the device that the website is being viewed on.
False
What is the smallest device that will display these columns side by side? <div class="row"> <div class="col-sm-6">1</div> <div class="col-sm-6">2</div> </div>
Tablet
While building a Bootstrap grid we use ________
divs
The Bootstrap class lg means for
larger desktop
True or False: Bootstrap example websites can be used as a starter template for your own projects.
True
All site content needs to be inside a ________ div to make the content responsive.
"container"
How many columns fit in a single row in the Bootstrap grid system?
12
medium devices are defined as having a screen width from
992 to 1199 pixels
Which of the following is not a Bootstrap component covered in this unit?
Emojis
What is the largest device that will display this row in stacked columns? <div class="row"> <div class="col-sm-6">1</div> <div class="col-sm-6">2</div> </div>
Smart Phone
which class makes rounded corner images
img-rounded